在vue-cli中组件通信的方法

发布时间：2020-12-17 02:40:31 所属栏目：百科来源：网络整理

导读：本文介绍了在vue-cli中组件通信的方法，分享给大家。具体如下： vue组件之间的通信包括三种： 1.父组件向子组件通信2.子组件向父组件通信3.同级组件之间的通信一.父传子组件通信拿app.vue当父组件，content.vue当子组件 1.父组件中导入子组件（子组件导出

本文介绍了在vue-cli中组件通信的方法，分享给大家。具体如下：

vue组件之间的通信包括三种：

1.父组件向子组件通信 2.子组件向父组件通信 3.同级组件之间的通信

拿app.vue当父组件，content.vue当子组件

1.父组件中导入子组件（子组件导出）

2.在父组件中注册子组件

3.子组件通过props来接收数据

子组件：

methods: {
down() {
this.$emit('down','null'); //主动触发down方法，'null'为向父组件传递的数据
}
}

父组件：

//监听子组件触发的down事件,然后调用changes方法

methods: { changes(msg) { this.test= test; } }

组件1触发：

methods:{ eve(){ a.$emit("change",'null') } }

组件2接收：

created(){ a.$on('change',()=>{ this.msg = 'null' }) }

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!