vue.js组件通讯

因为vue.js拥有多组件的特色，因此其中会涉及到组件之间的通讯，在学习vue.js两周当中，通讯在整个系统开发是比较重要的，因此我把我两周以来学习到的相关知识给你们分享一下！

相关的知识在官网中查询

这张图用文字表达就是：

1. 父组件向子组件发送信息运用props
2. 子组件向父组件发送信息运用emit

相关实例:

1、父组件向子组件发送信息

操做：当父组件文本框中输入值，子组件接收到的值也会改变，由于使用了双向绑定，以下图所示

子组件接收值：这样就完成了父组件向子组件发送值，props中还有许多操做，好比将传送的类型从数组改成对象，用于限制数据类型等功能

补充：限制数据类型

因为接收值类型应该为Number类型，可是咱们传送的是String,因此

2、子组件向父组件发送信息

这个操做与上一个通讯方式较复杂一丢丢，首先须要认识一个方法，相关概念查询官网api就能够知道，这里不作太多解释，
其中vm表明的是当前实例，在当前实例当中能够运用this，或者let vm = this

当在子组件中点击emit按钮，就会将文本框的值发送给父组件

根据我我的理解，emit就是绑定一个自定义事件，后一个参数是所须要传送的值

当子组件触发my-event事件，也会触发父组件中result方法

val就是子组件传过来的值：

最终结果：

以上都是我的总结，如有不正确的地方，还请你们多多指教