持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第4天，点击查看活动详情
今天简单说一下我用到的熟悉的几个组件间值传递方式有哪些。
我在项目中用的最多的就是props和$emit配合完成父子组件的传递例
比如这样的场景。
在ui组件中使用dialog弹出框。弹出框中的数据需要使用父组件也就是调用弹出框的页面中的数据来进行渲染数据。这时我们将弹出框拿出来写成组件方便使用。数据就需要在组件中绑定，使用props绑定父组件中的数据isShow来控制是否弹出，@closeModel绑定的是一个$emit事件，在子组件中调用closeModel方法来修改父组件中的数据。
<dialog-model :isShow="isshow" @closeModel="isShow=false" :plandetail="plandetail"></dialog-model>
缺点是如果数据传递层级复杂的话，数据传递起来会很麻烦，因为要层层嵌套，一层一层的传递数据
第二个依赖注入方法injec/provide
这个方法是vue2.2版本新增的。在含有数据的（祖先）组件中使用provide方法注入，这个组件的包含的每一层组件都可以通过inject来查看到祖先组件中的数据，provide 选项应该是一个对象或返回一个对象的函数。该对象包含可注入其子孙的 property。
这个缺点是provide传递的数据是非响应式的，如果要传递响应式数据可以先新建ref实例，或者传入可监听对象，computed的数据。还有一个，它不能区分哪个层级的子孙组件在调用数据。
这个方法常在ui组件中，可以看到elementUI等中传递数据都用的依赖注入方法，因为不能确定组件的使用者会在哪层传递数据所以使用依赖注入方式会更方便。
//祖先组件
provide: {
foo: 'bar'
},
//后代组件
inject: ['foo'],
