• eventBus 与 this.$emit


    1.使用方法是是建立eventBus.js文件,暴露一个空的Vue实例,如下:
    import Vue from 'vue'
    export default new Vue();

      2.在需要通信的两个组件中分别import

       import bus from "common/utils/eventBus";

      3.然后就可以通过emit、on进行通信:如下:

        一个组件中发射 传送参数
         bus.$emit('SUBMITSEARCH_PEOPLE',this.searchContent)

        另一个组件中接收 接收参数
         bus.$on('SUBMITSEARCH_PEOPLE', function (data) {...}

        其中可能会遇到一个坑是$on()会触发多次,具体原因跟生命周期有关,详细分析可参考:
        https://blog.csdn.net/chern1992/article/details/80392465

        解决办法就是在beforeDestroy或destroy周期中将事件进行销毁,使用$off()

        beforeDestroy () {
          bus.$off('SUBMITSEARCH_PEOPLE')
        },

    原文:https://blog.csdn.net/qq_21132509/article/details/81505081

    //子
    this.$emit('fatherFunction',"参数")
    //父
    <li @fatherFunction = "fathers">
    methods:{
    
        fathers(data){
    
          //处理子传来的参数
    
    
        }
    
    }
  • 相关阅读:
    两小时入门Docker
    Django之Model操作
    Django-channels 实现WebSocket实例
    Python项目中的单元测试
    將Python打包成 exe可执行文件
    CORS 跨域
    购物车模块
    登陆模块
    Git 基本用法
    Django ORM性能优化 和 图片验证码
  • 原文地址:https://www.cnblogs.com/joer717/p/10862881.html
Copyright © 2020-2023  润新知