标签:second data func val 传递 总线 span 定义 cond
非父子组件之间的通信,必须要有公共的实例(可以是空的),才能使用 $emit
获取 $on
的数据参数,实现组件通信
第一个组件的数据传递给第二个组件
公共实例文件bus.js,作为公共数控中央总线
import Vue from "vue"; export default new Vue();
第一个组件 first.vue
import Bus from ‘../bus.js‘; export default { name: ‘first‘, data () { return { value: ‘我来自first.vue组件!‘ } }, methods:{ add(){// 定义add方法,并将msg通过txt传给second组件 Bus.$emit(‘txt‘,this.value); } } }
第二个组件second.vue
import Bus from ‘../bus.js‘; export default { name: ‘second‘, mounted:function(){ Bus.$on(‘txt‘,function(val){//监听first组件的txt事件 console.log(val); }); } }
标签:second data func val 传递 总线 span 定义 cond
原文地址:https://www.cnblogs.com/zhaodz/p/12043574.html