父组件到子组件通讯

父组件到子组件的通讯主要为：子组件接受使用父组件的数据，这里的数据包括属性和方法（String,Number,Boolean,Object, Array ,Function）。vue提倡单项数据流，因此在通常情况下都是父组件传递数据给子组件使用，子组件触发父组件的事件，并传递给父组件所需要的参数。

父组件中引用子组件

父组件向子组件传递数据方法：

1、通过props传递数据

父子通讯中最常见的数据传递方式就是通过props传递数据

        父组件：

    子组件：

props可以接受function,所以function也可以以这种方式传递到子组件使用。

2、子组件通过 $emit调取通过 $on 绑定在父组件的方法

通过$on传递父组件方法是组件通信中常用的方法传递方式。它可以与通过props传递方法达到相同的效果。相比于props传递function,它更加的直观和显示的表现出了调用关系。

        父组件：

        子组件：

父组件获取子组件数据或者function的方法$refs：

尽量避免使用这种方式。因为在父子组件通信的过程中。父组件是处于高位是拥有控制权，而子组件在多数情况下应该为纯视图组件，只负责视图的展示和自身视图的逻辑操作。对外交互的权利应该由父组件来控制。所以应当由父组件传递视图数据给子组件，子组件负责展示。而子组件的对外交互通过$emit触发父组件中相应的方法，再由父组件处理相应逻辑。

父组件

子组件