vue 数据共享,vue不同组件数据传递

　　本文主要介绍了Vue组件之间的数据共享，具有一定的参考价值。感兴趣的朋友可以参考一下，希望能帮到你。

　　:

目录

　　 1.在项目开发中，组件之间最常见的关系分为以下两种：1.1父子组件之间的数据共享1。亲子共享数据2。子-父共享数据1.2兄弟组件之间的数据共享概要。

一、在项目开发中，组件之间的最常见的关系分为如下两种：

　　1.父子关系

　　2.兄弟关系

1.1 父子组件之间的数据共享

　　父子组件之间的数据共享分为：

1.父 - 子共享数据

　　子组件：

　　父组件：

2.子 - 父共享数据

　　子组件使用自定义事件与父组件共享数据。示例代码如下

　　子组件：

　　父组件：

　　页面显示结果：

1.2 兄弟组件之间的数据共享

　　在vue2.x中，兄弟组件之间数据共享的方案是EventBus。

　　EventBus使用方法：

　　创建eventBus.js模块，共享Vue的一个实例对象。

　　在数据发送端，调用总线。$ emit(事件名称，要发送的数据)方法来触发自定义事件。

　　在数据接收器上，呼叫总线。$ on (event name ，event handler)方法来注册自定义事件。

　　示例：

　　1.创建eventBus.js模块，共享Vue的一个实例对象。

　　2.在数据发送端，调用总线。$ emit(事件名称，要发送的数据)方法来触发自定义事件。

　　3.在数据接收器上，呼叫总线。$ on (event name ，event handler)方法来注册自定义事件。

总结

　　本文到此为止。希望能帮到你，也希望你能多关注我们的更多内容！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。