直接看图说话

vue Bus总线

import Vue from 'vue';
import VueBus from 'vue-bus';
Vue.use(VueBus);

这是子组件要发到父组件的写法

组件一

　this.$bus.emit('add-todo','这里是发送的数据');

组件二

created(){

this.$on('add-todo',(data)=>{

console.log(data,'接收到的数据')

})

}

转载于:https://www.cnblogs.com/wgy0528/p/10178667.html

vue 父子之间通信及非父子之间通信相关推荐

Vue 学习06——Vue父子组件通信、非父子组件通信1
目录㋀㋊ ✎ 父子组件间通信(Communication) ◆ 组件间通信父组件向子组件传递数据 ➬ ① 前言 ② demo ➬ 还有一种形式叫做插槽 ◆ 子组件向父组件传递数据 ① 前言 ② ...
vue父子组件通信以及非父子组件通信的方法
组件是 vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用.一般来说,组件可以有以下几种关系,父子关系.兄弟关系和隔代关系,简化点可以分为父子关系和 ...
子组件调用父组件方法_vue父子组件通信以及非父子组件通信的方法
组件是 vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用.一般来说,组件可以有以下几种关系,父子关系.兄弟关系和隔代关系,简化点可以分为父子关系和 ...
react中类组件传值，函数组件传值：父子组件传值、非父子组件传值
父子组件传值.非父子组件传值: 类组件传值父子组件传值子传父: 子组件:事件的触发sendMsg=()=>{this.props.person();}父组件:<Child per ...
初识 Vue（18）---（非父子组件间的传值）
非父子组件间的传值常一个应用会以一棵嵌套的组件树的形式来组织:将一个大组件进行拆分下图这种情况的组件间传值(父子组件间传值) 方法:父组件通过 Props 向子组件传值,子组件通过事件触发向父组件 ...
Angular 父子组件传值，非父子组件传值
一.子组件调用父组件,父组件给子组件传值引入Input header.component.ts import { Component, OnInit, Input, Output } from '@ ...
angular框架如何实现父子组件传值、非父子组件传值
文章目录 1.理解父子组件.非父子组件 2.父组件给子组件传值- -@input 3.父组件通过@ViewChild主动获取子组件的数据和方法 4.非父子组件如何传递数据 1.理解父子组件.非父子组件 ...
vue中父子组件先后渲染_vue父子组件传值（子传父，非父子组件传值）
1. 子组件向父组件传值子组件: <template><div>子组件:<span>{{childValue}}</span><!-- 定义一个 ...
父子组建传值_浅谈Vue父子组件和非父子组件传值问题
本文介绍了浅谈Vue父子组件和非父子组件传值问题,分享给大家,具体如下: 1.如何创建组件 1.新建一个组件,如:在goods文件夹下新建goodsList.vue goodsList组件 expor ...
Vue2.0的三种常用传值方式、父传子、子传父、非父子组件传值
Vue2.0 传值方式: 在Vue的框架开发的项目过程中,经常会用到组件来管理不同的功能,有一些公共的组件会被提取出来.这时必然会产生一些疑问和需求?比如一个组件调用另一个组件作为自己的子组件,那么我 ...

vue 父子之间通信及非父子之间通信

vue Bus总线

vue 父子之间通信及非父子之间通信相关推荐

最新文章

热门文章