7***@qq.com

发布：2020-12-04 18:04
更新：2020-12-09 10:01
阅读：927

【报Bug】tabbar页面调用相机时出现黑屏，并且在切换tabbar页面和非tabbar页面时，调相机时this.$refs会报错

分类：uni-app

bug反馈

产品分类： uniapp/App

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： windows 10 家庭版

HBuilderX类型：正式

HBuilderX版本号： 2.9.8

手机系统： Android

手机系统版本号： Android 10

手机厂商：华为

手机机型： P40 Pro

页面类型： vue

打包方式：云端

项目创建方式： HBuilderX

示例代码：

tabbar页面调用相机代码如下

  uni.scanCode({  
        success: function(res) {  
          let val = res.result;  
            if(val != "" && val != undefined){  
                _this.loadingContent = "二维码识别中";  
                _this.$refs.loading.showLoading();  
                // 提交到socket  
                _this.$store.commit('send', {  
                    type: '请求路径',  
                    data: {  
                        user : val  
                    }  
                })  
            }else{  
              uni.showToast({  
                    icon: "none",  
                    title: "扫码失败"  
                })  
                console.log('error : ', res.result);  
          }  
        },  
        fail : function(e){  
             console.log('read fail >> ');  
        }  
    });

tabbar页面调用 hideLoading()代码如下

// socket监听  
uni.onSocketMessage(function(res) {  
  let obj = JSON.parse(res.data);  
  ...  
  let res = JSON.parse(obj.data);  
  switch (obj.type) {  
      case '请求路径':  
          _this.loadingContent = '';  
          _this.$refs.loading.hideLoading();  
          if(res.code == 1){  
              // 页面跳转  
          }else{  
              uni.showToast({  
                  icon: "none",  
                  title: "错误信息"  
              })  
          }  
          break;  
  }  
});

非tabbar页面代码与tabbar页面代码基本一致

操作步骤：

问题一复现

tabbar页面增加相机调用。真机调试或者打包好后，频繁打开相机并返回。手机配置较低时，更容易出现卡死情况。但是非tabbar页面暂时未发现这种情况。

问题二复现

tabbar页面相机识别二维码后，正常加载loading动画。点击跳转到有相机的页面，启动相机识别，正常调用。返回tabbar页面后。打开相机时，使用 ·this.$refs·加载loading动画时，正常启动，但是启动中会报错，此时我通过console.log，并未发现关闭前执行到关闭的代码。

预期结果：

相机正常启动，并且切换页面识别二维码正常调用`$refs`来加载loading动画等操作。

实际结果：

tabbar页面相机，频繁打开关闭。或者低配手机会出现打开黑屏、APP卡死等问题。
tabbar页面在切换之后，会出现使用相机识别二维码时，钩子调用过程中报错

bug描述：

目前已知两个BUG

问题一、tabbar页面的相机，在频繁打开并返回，会出现相机调用失败、黑屏、APP卡死等情况。真机调试时问题较严重，卡死次数较多。

问题二、我的APP做了相机识别二维码的功能。但是tabbar页面调用相机，在APP刚启动时，识别过程正常，无问题，在跳转至非tabbar页面，调用相机之后，再切回之前的tabbar页面，调用相机会在使用$refs时报错。
相机识别时，会调用_this.$refs.loading.showLoading() ，来启动loading动画效果。关闭动画，会调用this.$refs.loading.hideLoading() 。

报错时，是在识别二维码，调用 this.$refs.loading.showLoading() 后，Loading动画加载出来时，报错。但是此时 this.$refs.loading.hideLoading() 没被正常调用。

错误如下：
[Vue warn]: Error in event handler for "api.onSocketTaskStateChange": "TypeError: Cannot read property 'hideLoading' of undefined"  
(found <Root>)  
TypeError: Cannot read property 'hideLoading' of undefined  

2020-12-04 18:04 负责人:无分享

3 个回复

DCloud_UNI_Anne

您报bug/咨询问题的姿势好像不对哦，详情https://ask.dcloud.net.cn/article/38139

7***@qq.com (作者)

第一次提交，哪里写的不对，请指出。

7***@qq.com (作者)

没有人碰到过嘛？还是我描述的不够明确

该问题目前已经被锁定, 无法添加新回复

【报Bug】tabbar页面调用相机时出现黑屏，并且在切换tabbar页面和非tabbar页面时，调相机时this.$refs会报错

问题一复现

问题二复现

预期结果：

相机正常启动，并且切换页面识别二维码正常调用`$refs`来加载loading动画等操作。

实际结果：

tabbar页面相机，频繁打开关闭。或者低配手机会出现打开黑屏、APP卡死等问题。
tabbar页面在切换之后，会出现使用相机识别二维码时，钩子调用过程中报错

bug描述：

3 个回复

公告

相关问题

【报Bug】tabbar页面调用相机时出现黑屏，并且在切换tabbar页面和非tabbar页面时，调相机时this.$refs会报错

问题一复现

问题二复现

预期结果： 相机正常启动，并且切换页面识别二维码正常调用$refs来加载loading动画等操作。

实际结果： tabbar页面相机，频繁打开关闭。或者低配手机会出现打开黑屏、APP卡死等问题。 tabbar页面在切换之后，会出现使用相机识别二维码时，钩子调用过程中报错

bug描述：

与内容相关的链接

3 个回复

公告

相关问题

预期结果：

相机正常启动，并且切换页面识别二维码正常调用`$refs`来加载loading动画等操作。

实际结果：

tabbar页面相机，频繁打开关闭。或者低配手机会出现打开黑屏、APP卡死等问题。
tabbar页面在切换之后，会出现使用相机识别二维码时，钩子调用过程中报错