vue组件通信总结归纳

vue组件通信

1. 建好两个组件，父组件引入子组件，绑定动态数据，子组件通过props接受数据，有数组和对象的写法；
2. 子传父：子组件绑定事件，传入数据（@click=“sendTofather”），在父组件中的子组件标签绑定一个事件@propsFromSon=“sonMsg”，sonMsg（msg）msg作为参数也为子组件的数据，msg就是子组件传过来的值。
3. 兄弟组件通过全局bus,let bus=new Vue(); Vue.prototype.bus=bus,绑定到原型上，在组件中通过this即可访问，传数据通过$emit，this.bus.$emit(“事件”，数据)，在组件接受，$on,this.bus.$on(‘事件’)；
4. 通过路由传数据：（router-link 标签），:to="{name:‘Home’,params:{id:1,text:‘你好，我是传过来的值’}}"; 通过this.route去接受数据；this.route.params,就是我们需要的数据；