• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录

joer717

  • 博客园
  • 联系
  • 订阅
  • 管理

公告

View Post

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){

      //处理子传来的参数


    }

}

 

posted on 2019-05-14 16:18  joer717  阅读(718)  评论(0)    收藏  举报

刷新页面返回顶部
 
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3