const list={}

// 将事件名和事件函数装进事件池里
function $on(name,func) {
if(!name || !func) return;
if(!Object.keys(list).includes(name)){
list[name]=func;
}
}
// 根据事件名称搜索事件池 找到执行
function $emit(name,...arg) {
if(!name) return;
if(Object.keys(list).includes(name)){
list[name](...arg)
}
} // 执行完并且不在需要后 清除事件
function $off(name) {
if(!name) return;
if(Object.keys(list).includes(name)){
list[name]=null;
delete list[name]
}
}
export {
$on,
$emit,
$off,
}

封装事件订阅来进行非父子组件的传值(React)的更多相关文章

  1. Vue父子,子父,非父子组件之间传值

    Vue组件基础 纯属随笔记录,具体详细教程,请查阅vue.js网站 子组件给父组件传值: <body> <div id="app"> <my-app& ...

  2. Vue-发布订阅机制(bus)实现非父子组件的传值

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. vue中父子组件之间的传值、非父子组件之间的传值

    在Vue实例中每个组件之间都是相互独立的,都有自己的作用域,所以组件之间是不能直接获取数据.在项目开发中一个组件可能需要获取另一个组件的值,我们可以通过其他方法间接的获取.所以,获取的方法有以下几种: ...

  4. 组件基础(非父子组件传值)—Vue学习笔记

    最近几天忙着写Api去了,抽空把后面的内容下出来,然后再分享给大家web可以使用的api. 上次说了父子组件直接的传值,这次看一下非父子组件之间的传值(总线机制) 要实现非父子组件之间的传值非常重要的 ...

  5. Vue组件传值,父传子,子传父,非父子组件

    vue3中传值方式: 1.父组件向子组件传值 父组件Blog.vue <template> <div id="blog"> <Alert v-if=& ...

  6. Vue—非父子组件间的传值(Bus/发布订阅模式/观察者模式/总线)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. vue 非父子组件之间的传值(Bus/总线/发布订阅模式/观察者模式)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. vue bus方式解决非父子组件间的传值

    对于非父子组件之间的传值 通常使用VUEX 和总线等方式解决 这里我聊聊发布订阅模式(总线) <body> <div class="app"> <ch ...

  9. Vue 非父子组件通信

    组件是Vue核心的一块内容,组件之间的通信也是很基本的开发需求.组件通信又包括父组件向子组件传数据,子组件向父组件传数据,非父子组件间的通信.前两种通信Vue的文档都说的很清楚,但是第三种文档上确只有 ...

随机推荐

  1. java开发两年!这些异常处理的方式你得知道,不然你凭什么涨薪!

    前言 异常是在程序中导致程序中断运行的一种指令流,当异常发生时,程序将直接中断,不再执行后续的任何操作! 示例:两数相除,若不处理任何异常,则只有在正确输入两个数字时,才能显示出运算结果. publi ...

  2. 如何在FL Studio中使用自动剪辑(下)

    在上集中我想大家介绍了FL Stduio Automation Clip的创建.播放列表操作及包络线类型介绍,在这篇文章中我将会给大家介绍如何在播放列表中使用Automation,剪辑通道的操作及使用 ...

  3. 让mac电脑更简单运行Windows软件的CrossOver,优势知多少?

    如今,一些iPhone和iPad机型拥有Face ID功能,此功能作用允许用户通过面部识别来解锁设备.该功能还不能在Mac上使用,但是国外媒体于7月27日报道称,在公测第三版的macOS Big Su ...

  4. Word1-提取图片文字

    1.OneNote # 将图片以图片格式粘贴在OneNote中-右键选择"复制图片中的文本"-粘贴"只保留文本"即可 这种方式识别率较高!!! 2.手机QQ图片 ...

  5. flink:StreamGraph转换为JobGraph

    1 转换基本流程 2 简单来看可以分为两部分: 第一部分是通过一些util.translator.generator等类将职责进行解耦.托管和分离,期间涉及FlinkPipelineTranslati ...

  6. python批量爬取猫咪图片

    不多说直接上代码 首先需要安装需要的库,安装命令如下 pip install BeautifulSoup pip install requests pip install urllib pip ins ...

  7. redis数据量大时bgsave线程阻塞redis原因

    rt 转载 Latency generated by fork In order to generate the RDB file in background, or to rewrite the A ...

  8. 数论之prufer序列

    定义 \(Prufer\) 数列是无根树的一种数列. 在组合数学中,\(Prufer\) 数列由有一个对于顶点标过号的树转化来的数列,点数为 \(n\) 的树转化来的 \(Prufer\) 数列长度为 ...

  9. JDK7HashMap

    JDK7HashMap 成员变量 HashMap中定义了非常多的成员变量以及常量,各成员变量含义具体如下: //默认初始化长度-16 static final int DEFAULT_INITIAL_ ...

  10. 解决 Zuul 中 OAuth2 报 unauthorized 错误

    问题描述 微服务中使用 OAuth2 鉴权,直接访问正常,通过 Zuul 访问报错: { "error": "unauthorized", "erro ...