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. linux centos 6.x 装机后基本优化

    1.关闭SELinux /etc/selinux/config配置文件内替换 se -i 's/SELINUX=enforcing/SELINUX=disabled/g'需要重启grep SELINU ...

  2. Dockerfile中如何自动回答标准输入的问题

    前言大家在用docker build制作自己的image的時候,都会用RUN命令来执行一些操作来安装某些必须的软件. 而一些软件的安装过程中会需要用户来输入yes/no或者y/n来确定一些东西后才能进 ...

  3. [原题复现+审计][BUUCTF 2018]WEB Online Tool(escapeshellarg和escapeshellcmd使用不当导致rce)

    简介  原题复现:https://github.com/glzjin/buuctf_2018_online_tool (环境php5.6.40)  考察知识点:escapeshellarg和escap ...

  4. CENTOS 6 配置 yum 安装 nginx

    摘要: 本文介绍如何用yum源安装Nginx,比编译安装简单很多 1.在/etc/yum.repos.d/目录下创建一个源配置文件nginx.repo: cd /etc/yum.repos.d/ vi ...

  5. [head first 设计模式]第二章 观察者模式

    [head first 设计模式]第二章 观察者模式 假如我们有一个开发需求--建造一个气象观测站展示系统.需求方给我们提供了一个WeatherObject对象,能够自动获得最新的测量数据.而我们要建 ...

  6. web安全入门--入门条件

    介绍:网络安全由习大大提出,是继海.陆.空.外太空的第五大作战领域,也是一个关系国家安全和主权.社会稳定.民族文化继承和发扬的重要问题.其重要性,正随着全球信息化步伐的加快越来越重要.接下来,我向大家 ...

  7. ABBYY FineReader 15 PDF文档编辑功能详解

    ABBYY FineReader 15(Windows系统)OCR文字识别软件作为一款通用 PDF 工具,能轻松有效地对各种 PDF文档和纸质文档,进行数字化.检索.编辑.转换.包含.分享和合作,而其 ...

  8. 在CorelDRAW2019创建对称绘图模式

    对称绘图模式是CorelDRAW 2018推出的全新功能,在2019的版本中又得到了极大的完善,通过对称绘图模式可以创建平衡.和谐.独一无二的效果,对称在大自然中随处可见,因此设计元素很可能将依靠于它 ...

  9. JAVA8新特性Optional,非空判断

    Optional java 的 NPE(Null Pointer Exception)所谓的空指针异常搞的头昏脑涨, 有大佬说过 "防止 NPE,是程序员的基本修养." 但是修养归 ...

  10. docker和k8s的概念-IaaS、PaaS、SaaS 的区别

    docker和k8s 参考: 什么是Docker? Kubernetes概述 openstack,docker,mesos,k8s什么关系? IaaS.PaaS.SaaS的概念 SaaS:软件服务,S ...