uni-app 打包后，微信小程序 showLoading 报错

uni-app 打包后，微信小程序 showLoading 报错

操作步骤：

  • 调用任意云对象，然后观察微信小程序ide的控制台日志，有error输出。且小程序界面不显示loading窗口

预期结果：

  • 不输出错误日志、显示loading窗口

实际结果：

  • 输出错误日志、不显示loading窗口

bug描述：

  • 调用云对象时，微信小程序版本会报错：Unhandled promise rejection {errno: 1001, errMsg: "showLoading:fail parameter error: parameter.title should be String instead of Undefined;"}
  • 经排查发现，打包后的common/vendor.js公共代码有误，引用title字段，但是实际字段是text

错误截图：

错误截图

开发环境 版本号 项目创建方式
Windows win7 HBuilderX
HBuilderX 3.4.7

更多关于uni-app 打包后，微信小程序 showLoading 报错的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复

感谢反馈，此问题将在下版修复。目前可以通过指定loadingOptions的title来规避此错误

更多关于uni-app 打包后，微信小程序 showLoading 报错的实战教程也可以访问 https://www.itying.com/category-93-b0.html


调用云对象时，showLoading是自动内置的，无法设置loadingOptions

回复 5***@qq.com: importObject方法第二个参数可以传递loadingOptions

HBuilderX 3.4.14 已修复

在 uni-app 打包成微信小程序后，如果在使用 wx.showLoading 时遇到报错，可能是由于以下几个原因导致的。以下是一些常见的排查和解决方法：

1. API 调用时机不正确

wx.showLoading 必须在页面或组件的生命周期函数中调用，或者在用户交互事件（如点击事件）中调用。如果在异步回调中直接调用，可能会导致报错。

解决方法：

  • 确保 wx.showLoading 是在页面生命周期或用户交互事件中调用。
  • 如果需要在异步回调中调用，可以使用 setTimeout 包裹，确保在合适的时机执行。
setTimeout(() => {
    wx.showLoading({
        title: '加载中...',
    });
}, 0);

2. 未在 onLoad 或 onShow 生命周期中调用

在微信小程序中，wx.showLoading 必须在页面的 onLoad 或 onShow 生命周期中调用，否则可能会报错。

解决方法：

  • 确保 wx.showLoading 是在 onLoad 或 onShow 中调用。
onLoad() {
    wx.showLoading({
        title: '加载中...',
    });
}

3. 未正确隐藏 wx.showLoading

如果在调用 wx.showLoading 后，没有正确调用 wx.hideLoading 隐藏加载框，可能会导致后续的 wx.showLoading 调用报错。

解决方法：

  • 确保在适当的时候调用 wx.hideLoading 隐藏加载框。
wx.showLoading({
    title: '加载中...',
});

// 模拟异步操作
setTimeout(() => {
    wx.hideLoading();
}, 2000);

4. 未正确引入或使用 wx 对象

在 uni-app 中，wx 对象是微信小程序的全局对象。如果未正确引入或使用，可能会导致报错。

解决方法：

  • 确保在代码中正确使用 wx 对象。
// 正确使用 wx 对象
wx.showLoading({
    title: '加载中...',
});

5. 微信开发者工具缓存问题

有时微信开发者工具的缓存可能会导致一些奇怪的问题，包括 wx.showLoading 报错。

解决方法：

  • 清理微信开发者工具的缓存，然后重新编译和运行项目。

6. uni-app 版本问题

如果 uni-app 版本较旧，可能存在一些兼容性问题，导致 wx.showLoading 报错。

解决方法：

  • 升级 uni-app 到最新版本，确保兼容性。

7. 小程序基础库版本问题

如果微信小程序基础库版本过低，可能会导致某些 API 无法正常使用。

解决方法：

  • 在微信开发者工具中，确保基础库版本是最新的，或者在项目中设置最低基础库版本。
// app.json
{
    "miniprogram": {
        "libVersion": "2.15.0"
    }
}

8. uni-app 的 showLoading 封装问题

uni-app 提供了自己的 uni.showLoading 方法，建议优先使用 uni-app 提供的 API，而不是直接使用 wx.showLoading。

解决方法：

  • 使用 uni.showLoading 代替 wx.showLoading。
uni.showLoading({
    title: '加载中...',
});

// 隐藏加载框
uni.hideLoading();
回到顶部