土豆鸡丁_o0
土豆鸡丁_o0
  • 发布:2021-10-15 12:14
  • 更新:2023-07-07 21:48
  • 阅读:804

【报Bug】同一个组件在多个页面复用,某个页面调用组件,触发了其它页面响应

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: win10 19042.1288

HBuilderX类型: 正式

HBuilderX版本号: 3.2.9

手机系统: Android

手机系统版本号: Android 11

手机厂商: 小米

手机机型: 红米 K30 Ultra

页面类型: vue

打包方式: 云端

项目创建方式: HBuilderX

示例代码:

同一个组件分别在两个页面下引用

//page1.vue  
<imgSelector :showSelector.sync="selectorShow" @getUrl="upload_handle" targetType="vin"></imgSelector>
//page2.vue  
<imgSelector :showSelector.sync="selectorShow" @getUrl="upload_handle" targetType="car"></imgSelector>

之后在page2中调用组件,并用组件触发事件,page1中的组件也会被触发事件

操作步骤:

同一个组件在多个页面复用,从某个页面调用组件,触发的事件其他页面接收!这算是bug吗?vue没遇到过这种情况

预期结果:

组件在哪个页面,就只在当前页面触发事件

实际结果:

同一个组件在多个页面复用,从某个页面调用组件,触发的事件其他页面接收

bug描述:

同一个组件在多个页面复用,从某个页面进入组件,触发的事件其他页面接收!这算是bug吗?vue没遇到过这种情况

2021-10-15 12:14 负责人:无 分享
已邀请:
7***@qq.com

7***@qq.com

两年了,没人解决这个问题吗?我特么也遇到了

  • YUANRJ

    提供下你的具体版本和平台信息

    2023-03-07 19:40

  • 7***@qq.com

    回复 YUANRJ: vue-cli搭建,

    "@dcloudio/uni-mp-alipay": "^2.0.1-alpha-36820221027001",

    HBuilderX:3.7.3.20230223,

    我现在把这个公共组件完全复制一份出来,分别在两个页面使用,它竟然还能触发到另一个页面的事件

    2023-03-08 09:41

  • YUANRJ

    回复 7***@qq.com: 升级一下依赖的版本再试试

    2023-03-08 10:29

  • 7***@qq.com

    回复 YUANRJ: 升级到2.0.2-alpha-3070620230227001,还是不行

    2023-03-08 11:15

  • YUANRJ

    回复 7***@qq.com: 支付宝小程序平台是吧

    2023-03-08 11:19

  • YUANRJ

    回复 7***@qq.com: 我这测试未复现此问题,请提供一下测试工程。

    2023-03-08 11:27

  • 7***@qq.com

    回复 YUANRJ: 下面评论我添加的demo附件,麻烦查看下

    2023-03-08 13:32

  • 7***@qq.com

    回复 YUANRJ: 问题其实已经明确了,就是这个uni.getRecorderManager()是全局的,每一次组件组件挂载,onstop钩子总是被覆盖到最新的页面上,导致里面的方法回调总是指向新页面,该如何去避免这个问题呢

    2023-03-08 14:03

YUANRJ

YUANRJ

HBuilderX3.7.3.20230223未复现此问题

7***@qq.com

7***@qq.com

测试平台:小程序开发者工具 - 钉钉应用 - 真机调试。
操作步骤:

  1. 默认进入页面homeA,点击录音 - 点击停止录音 - 触发成功方法on-success,页面A接收成功,打印homeA:handleRecordSuccess ;
  2. 点击去往页面homeB,点击录音 - 点击停止录音 - 触发成功方法on-success,页面B接收成功,打印homeB:handleRecordSuccess ;
  3. 返回页面A,再次点击录音 - 点击停止录音 - 触发成功,页面A未接收到成功回调,但页面B接收到成功回调,打印homeB:handleRecordSuccess;
    以上,麻烦帮忙看看。
  • 7***@qq.com

    解决了,不在mounted里初始化录音,每次点击录音时初始化录音没事了

    2023-03-08 14:21

zhangyq

zhangyq

这边也出现了类似的问题,单页面多次使用同一个组件,渲染会错位,跳转事件也错位,使用不同名称注册也有问题,不知道大家有遇到吗?

import iconTag1 from '@/components/iconTag/iconTag.vue'
import iconTag2 from '@/components/iconTag/iconTag.vue'

要回复问题请先登录注册