zZZ1Ma
zZZ1Ma
  • 发布:2022-11-24 17:22
  • 更新:2022-11-24 17:34
  • 阅读:246

【报Bug】【报Bug】字节 / 抖音 小程序 onShow等生命周期钩子注册实例错误

分类:uni-app

产品分类: uniapp/小程序/字节跳动

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: Win11 21H2

HBuilderX类型: 正式

HBuilderX版本号: 3.6.5

第三方开发者工具版本号: 抖音开发者工具 V4.0.0

基础库版本号: 2.74.0.8

项目创建方式: HBuilderX

示例代码:

index.vue

<template>  
  <custom-cmp></custom-cmp>  
</template>  

<script setup>  
  // 此处不要注册生命周期钩子  
</script>

custom-cmp.vue

<template>  
  <view>custom component</view>  
</template>  

<script>  
  export default {  
    name: "custom-cmp",  
    onShow() {  
      console.log('pageShow', +new Date())  
    },  
    onPageShow() {  
      console.log(this);  
      console.log('onPageShow', +new Date())  
    },  
  }  
</script>  

<script setup>  
  import { onShow } from '@dcloudio/uni-app'  

  onShow(() => console.log('setupOnShow', +new Date()))  
</script>

操作步骤:

新建vue3空白项目及自定义组件,复制以上代码到对应.vue文件内;分别运行至微信小程序、字节小程序;查看控制台。

预期结果:
// 微信小程序log (时间戳已省略)  
onPageShow 1669278958...  
setupOnShow 1669278958...  
pageShow 1669278958...

实际结果:
// 字节小程序log (时间戳已省略)  
onPageShow 1669278958...

bug描述:

vue2 小程序的pageLifetimes(组件所在页面的生命周期)Hack方式

升级vue3后 import { onPageShow, onPageHide } from '@dcloudio/uni-app,并不兼容
实测import { onShow, onHide } from '@dcloudio/uni-app可在自定义组件内正常使用(微信、支付宝已验证可用)

字节小程序这样引入无Error,但不触发;逐一排除发现onShow被注册到组件实例上,而不是组件在页面实例上,导致无法触发,

很奇怪,console.log(this.$root)两端也不一样,字节小程序this.$roor.mpType居然是component而不是page

2022-11-24 17:22 负责人:无 分享
已邀请:
zZZ1Ma

zZZ1Ma (作者)

this.$root

要回复问题请先登录注册