vue2 组件间传值

子传父

子组件

传递给父组件 // 点击事件触发

data(){ return{ msg:"传递给父组件的信息", type: "类型" }},methods:{ toParent(){ this.$emit("toParent",{msg:this.msg, type: this.type}) // $emit 触发传递自定义的事件，{} 对象里可以传递数据 } }

父组件

methods:{

getData(data){

console.log(data); // 打印传递过来的数据

}

}

子组件之间传值

1. 在main.js中添加

new Vue({})里面增加

// 全局事件总线

beforeCreate() {

Vue.prototype.$bus = this;

}

2. 子组件1中用this.$bus.$emit('hello'，this.postData），接受完数据后立马解绑

在销毁钩子函数中this.$bus.$off('hell');

3. 子组件2中在钩子函数mounted()中增加 this.$bus.$on('hello', (data)=> {

this.showData = data;

}