vue.js 组件的通信三种常用方法及简单应用

vue组件的三种常用通信方法

1 父传子组件通信

上图中：是一个典型的父传子组件的应用，局部组件"mylist" 通过关键字props接收实例中的数据list,先通过传参，再进行操作渲染到页面。

2 子传父组件通信

上图中：也是一个简单的子传父组件的应用，子组件通过事件获取msg的值，通过关键字$emit和绑定事件进行传值，实例接收到子组件传来的值。

3 子组件与子组件通信

上图中：两个组件myList 和mySearch的通信，通过一个实例bus搭建桥梁，分别通过bus.$emit和bus. $on方法接收一个函数和值进行通信，从而达到两个子组件之间的通信传值。