Uniapp 在开发字节抖音小程序时使用 $refs 报错详细解决方案

  • 在使用 uniapp 在开发字节抖音小程序时,无论是打包还是调试,在有一些场景下都无法使用 $refs 去获取到子组件,一开始我以为是无法在,子组件里面通过 $refs 获取孙子组件,因为在父组件中是可以使用的,后面测试总结后,才发现是原来是只要通过 v-if 控制的组件,都无法获取到。

  • 最后在 github.com/dcloudio/uni-app/issues 中找到了解决方案,原来是 @dcloudio\uni-mp-toutiao 包出了问题有 bug

  • 经过排查,发现因为抖音 App 27.2.0 版本的 SDKVersion3.0.0,在 initRefs 方法中,对 selectAllComponents API 做了一个兼容处理:

    1、如果使用的是 HBuilder 工具开发直接升级工具为最新版就可以。

    2、如果使用的是命令行 cli 进行开发的话,需要更改一下 uniapp 打包抖音的插件。

    image.png

    需要找到如下目录 node_modules\@dcloudio\uni-mp-toutiao\dist\index.js,找到这段代码:

    function initRefs$1 (vm) {
      const mpInstance = vm.$scope;
      // /* eslint-disable no-undef */
      const minorVersion = parseInt(tt.getSystemInfoSync().SDKVersion.split('.')[1]);
      if (minorVersion > 16) {
        initRefs(vm);
      } else {
    

    修改成下面这段

    function initRefs$1 (vm) {
      const mpInstance = vm.$scope;
      /* eslint-disable no-undef */
      const [majorVersion, minorVersion] = tt.getSystemInfoSync().SDKVersion.split('.');
      if (parseInt(majorVersion) > 1 || parseInt(minorVersion) > 16) {
        initRefs(vm);
      } else {
    
  • 4
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

卡尔特斯

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值