Vue2.0实现组件之间数据交互和通信操作示例

本文实例讲述了Vue2.0实现组件之间数据交互和通信操作。分享给大家供大家参考,具体如下:

站在用户的角度思考问题,与客户深入沟通,找到永春网站设计与永春网站推广的解决方案,凭借多年的经验,让设计与互联网技术结合,创造个性化、用户体验好的作品,建站类型包括:成都网站制作、做网站、企业官网、英文网站、手机端网站、网站推广、域名申请、虚拟空间、企业邮箱。业务覆盖永春地区。

Vue2.0组件之间数据交互和通信。

Vue2.0废弃了dispatch 和 $broadcast,如何在实现组件之间的数据交互和通信?下面是一个简单的demo解决了这个问题。

事件中心(evengtHub.js):

//定义事件中心,在模板通信是使用。
import Vue from 'vue';
export default {
  bus: new Vue()
}

父组件:



子组件1





子组件2





上面的例子中包括父子组件之间互相传参数和组件之间的通信,更好的组件通信事件请使用vuex。

希望本文所述对大家vue.js程序设计有所帮助。


网页题目:Vue2.0实现组件之间数据交互和通信操作示例
网页路径:http://scyanting.com/article/pgspgd.html