zoukankan      html  css  js  c++  java
  • vue中eventbus被多次触发(vue中使用eventbus踩过的坑)【bus.$on事件被多次绑定】

     

    问题描述:只要页面没有强制刷新,存在组件切换,bus.$on方法会被多次绑定,造成事件多次触发

     
    触发bus.$on中绑定的方法.png
     
    bus.$on多次绑定.png

    解决办法:在每次调用方法前先解绑事件( bus.$off ),然后在重新绑定( bus.$on )

     bus.$off("backUpLevel");
            bus.$on('backUpLevel', () => {
                if(self.ONION.length <= 1){ 
                    self.jumpSubDir()
                }else{
                    let len = self.ONION.length-1
                    self.jumpTeamId(self.ONION[len].id,self.ONION[len].name,self.ONION[len].type)
                }
            })
    
     
    每次绑定前解绑bus.$on方法.png

    解决:
    看一下github上提出的。issue
    https://github.com/vuejs/vue/issues/3399

     
    image.png

    尤大大提出了以下解决:

     
    image.png

    *就是说,这个$on事件是不会自动清楚销毁的,需要我们手动来销毁。(不过我不太清楚这里的external bus 是什么意思,有大神能解答一下的吗,尤大大也提到如果是注册的是external bus 的时候需要清除)****

    所以。我在B组件页面中添加Bus.$off来关闭。代码如下:

    // 在B组件页面中添加以下语句,在组件beforeDestory的时候销毁。
      beforeDestroy () {
        bus.$off('get', this.myhandle)
      },
    
  • 相关阅读:
    Oracle第五周测验
    软件测试第五周
    Oracle第四周作业
    c++第二章测试
    软件测试第四章
    软件测试 第三章
    Centos 安装.NET Core环境
    .net core 集成极光推送
    Swagger添加文件上传测试
    linux firewall
  • 原文地址:https://www.cnblogs.com/chenhuichao/p/10122264.html
Copyright © 2011-2022 走看看