封装 EventBus 并在组件中实现传值

MagnumHou 2023-03-03 11:28:09

课时名称	课时知识点
封装 EventBus 并在组件中实现传值	封装 EventBus 并在组件中实现传值封装 EventBus 并在组件中实现传值

...全文

浏览回复打赏收藏举报

写回复

回复

切换为时间正序

请发表友善的回复…

发表回复

相关推荐

使用目的实现组件之内的通信，也就是传递数据适用范围兄弟组件传值、爷孙组件传值、封装组件的时候要所有被调用的这个组件同时响应实现一些功能的时候使用范例新建js文件 eventBus.js 内容为一个vue实例 import Vue from 'vue' export default new Vue() 如果全局调用的话，在main.js里面 import eventBus from './util/eventBus' Vue.prototype.$bus = eventBus 局部调用的话，直

provider: 状态管理来管理统一的状态（数据），实现不同组件直接的传值和数据共享。 eventBus: 现不同组件之间的数据传值，以及在一个组件中执行另一个组件的方法。

eventBus—兄弟组件传值两个组件页面a、b，属于兄弟关系，要求实现a向b传值，其传值实现过程如下：首先在vue 项目中的 main.js 创建一个 vue实例， export const eventBus = new Vue() 其中在a页面使用 eventBus，代码如下： import { eventBus } from "../main"; eventBus.$emit("userName", this.username); 在 b 页面使用 eventBus，代码如下： eve

组件传值之事件总线（两种方法实现使用事件总线传值）除了上面这种初始时候在main.js之中直接将eventBus挂载到vue实例上面的方法，我们还可以是使用封装js文件的方法实现事件总线传值，

Vue3 中没有了 EventBus 跨组件通信，但是现在有了一个替代的方案 mitt.js，原理还是 EventBus vue3兄弟传值只需安装一个小插件 npm i mitt -S 在src文件夹中建一个 mitt.js文件文件中写入以下内容 // 先安装 npm i mitt -S // 然后像以前封装 bus 一样，封装一下 import mitts from 'mitt' const mitt = mitts() export default mitt 兄弟组件a...

发帖

侯红彪的课程社区_NO_1

2

社区成员

263

社区内容

社区管理员

加入社区

帖子事件

编辑了帖子 (查看)

2023-03-03 13:55

创建了帖子

2023-03-03 11:28

社区公告

暂无公告