Vue组件通信

Posted 2020-12-31 mengff

1. 父子通信

父 -> 子 props
子 -> 父 事件$emit

父子传值，涉及到双向绑定的，一般用v-model，子组件使用$emit(‘input‘,data)
还有一种是使用props向下传递一个对象，由于对象是一个引用，直接修改对象的属性，
可以达到修改父组件值的目的，需要进一步验证。

2. 通用通信方案

1. Event bus

使用一个Vue实例，或者任意一个PubSub的库作为中心，进行消息通信。
例如：

let bus = new Vue();
Vue.prototype.bus = bus;

bus.$on 订阅事件
bus.$emit 触发事件

2. Vuex

通用的组件传值方案