(共556篇)
全部分类

uniapp中uni.chooseImage方法的底层bug(触发app级别onhide与onshow)的问题
[ Uniapp ] 

手里这个项目需要在小程序中使用richtext组件,并且要增加插入图片功能,uniapp 提供了richtext组件,可以直接拿来用,但是在选择图片之后,微信小程序可能会触发一个底层 BUG,这里记录一下。

问题: 选择图片之后,微信小程序自动切换到了登录页。

微信小程序自动切换到首页,可能牵扯两个问题:

  1. 某个 bug 导致微信小程序重新启动了
  2. 某个 bug 到导致微信小程序被重新定位到了首页

首先检查了一遍代码,没有发现任何使用uni.navigator的地方。

为了确认是不是第一个问题,我在App.vue中做了onLanuch,onShow,onHideonError钩子函数,再次点击某张图片后,发现控制台中onHideonShow依次被触发了

再详细的说,就是使用uni.chooseImg()时,触发了onHide,选择图片后,触发了onShow

在微信小程序文档中遨游了半天,发现不近是我一个人发现了这个问题,而且这个问题属于微信小程序的底层 BUG,(目前我的小程序开发版本为:2.12.1)

并且我的onShow函数中有一个检测 token 的功能,如果没有在 storage 中发现用户 token 会自动跳转到登录页。

现在问题找到了,就是因为这个底层 BUG 导致微信小程序进入了onShow的钩子函数,才导致每次选择图片都自动跳转到了登录页

解决办法

这样子我就得在onShow中添加一个变量,来判断是否检测 token,微信小程序中,如果要在富文本页面改变一个变量,还能让App.vueonShow中能获取到,只能把变量设置在globalData中了,

editor.vue

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
getApp().globalData.noCheckToken = true;
uni.chooseImage({
    success: function () {
        uni.uploadFile({
            success: function () {
                // 操作完成后,最好noCheckToken清空,或者设为false,因为如果用户关闭了当前小程序,再重新进入时,还会触发`onShow`,此时可能需要再次检测token
                getApp().globalData.noCheckToken = false;
            },
        });
    },
    fail: (err) => {
        // 记得这里也要做同样的处理
        getApp().globalData.noCheckTk = false;
    },
});

App.vue

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
export default {
    onShow() {
        console.log('App Show');
        if (this.$scope.globalData.noCheckToken == undefiend || this.$scope.globalData.noCheckToken == false) {
            // 这的作用是在onShow被触发时,检测storage中是否有token,如果没有会跳转到登录页
            const token = uni.getStorageSync('tk');
            if (token) {
                uni.reLaunch({
                    url: '/pages/index/login',
                });
            }
        }
    },
};

9 月 17 日再次测试发现,只有 android 平台上会导致这个 bug,所以在解决问题的时候,需要添加一个条件:判断当前平台是否为 android

App.vue

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
export default {
    onShow() {
        console.log('App Show');
        if ((uni.getSystemInfoSync().platform == 'android' && this.$scope.globalData.noCheckToken == undefiend) || this.$scope.globalData.noCheckToken == false) {
            // 这的作用是在onShow被触发时,检测storage中是否有token,如果没有会跳转到登录页
            const token = uni.getStorageSync('tk');
            if (token) {
                uni.reLaunch({
                    url: '/pages/index/login',
                });
            }
        } else {
            // 如果不是安卓,不会有那个bug,所以不需要那个条件,直接判断token即可
            const token = uni.getStorageSync('tk');
            if (token) {
                uni.reLaunch({
                    url: '/pages/index/login',
                });
            }
        }
    },
};