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

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

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

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

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

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

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

    需要找到如下目录 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 {
    

原文链接:https://juejin.cn/post/7353073795081142311 作者:卡尔特斯

(0)
上一篇 2024年4月3日 上午10:42
下一篇 2024年4月3日 上午10:52

相关推荐

发表评论

登录后才能评论