1.组件传值的方式

2.事件监听原理

3.事件管理器

utils/event.js

/**
* 事件池(事件管理器)
* 通过事件监听传值
*/
class Event {
constructor() {
this.events = {};
} // 监听
on(eventName,callBack){
if(this.events[eventName]){
// 存在事件
this.events[eventName].push(callBack);
}else{
// 不存在事件
this.events[eventName] = [callBack];
}
} // 触发
emit(eventName,params){
if(this.events[eventName]){
this.events[eventName].map((callBack) => {
callBack(params);
})
}
}
} export default Event;

4.调用实例

import Event from './event';
let myEvent = new Event(); // 实例化一个事件管理器 // 触发事件
myEvent.emit("changeCata"); // 监听事件
myEvent.on("changeCata",() => {
//
});

5.

taro 填坑之路(二)taro 通过事件监听 实现组件间传值的更多相关文章

  1. taro 填坑之路(三)taro 缓存

    1.taro 缓存 /** * 缓存数据 H5 小程序 * {food.id:{菜品信息 Num}, } */ import Taro from '@tarojs/taro'; // 取值 let s ...

  2. taro 填坑之路(一)taro 项目回顾

    (1)像素写法 PX -- 大写,否则会自动成rem (2)拿取列表第一条数据 let { activity:[firstItem] } = this.state; (3)使用props 需要设置默认 ...

  3. Android Studio 3.0正式版填坑之路

    原文:https://www.jianshu.com/p/9b25087a5d7d   Android Studio 3.0启动图 序言 总看别人的文章,今天尝试着自己来写一篇.在逛论坛时候,无意间发 ...

  4. 微信公众号支付备忘及填坑之路-java

    一.背景 最近公司给第三方开发了一个公众号,其中最重要的功能是支付,由于是第一次开发,遇到的坑特别的多,截止我写博客时,支付已经完成,在这里我把遇到的坑记录一下(不涉及退款).不得不吐槽一下,腾讯这么 ...

  5. 基于环信SDK的IM即时通讯填坑之路(vue)

    公司最近使用第三方环信SDK的进行通信聊天,基本已完成.记录下填坑之路 1.可以通过以下方式引用 WebSDK 1.安装 npm install easemob-websdk --save 2. 先 ...

  6. Android事件监听(二)——点击鼠标事件

    Button.ImageButton事件监听(setOnClickListener) 方法一:通过匿名内部类实现 代码如下: package com.note.demo2; import androi ...

  7. WebView使用详解(二)——WebViewClient与常用事件监听

      登录|注册     关闭 启舰 当乌龟有了梦想……       目录视图 摘要视图 订阅 异步赠书:Kotlin领衔10本好书      免费直播:AI时代,机器学习如何入门?      程序员8 ...

  8. Vue学习(二)-Vue中组件间传值常用的几种方式

    版本说明:vue-cli:3.0 主要分为两类: 1.父子组件间的传值 2.非父子组件间的传值 1.父子组件间传值 父组件向子组件传值 第一种方式: props 父组件嵌套的子组件中,使用v-bind ...

  9. Vue学习笔记(二)动态绑定、计算属性和事件监听

    目录 一.为属性绑定变量 1. v-bind的基本使用 2. v-bind动态绑定class(对象语法) 3. v-bind动态绑定class(数组语法) 4. v-bind动态绑定style(对象语 ...

随机推荐

  1. JZYZOJ1525 HAOI2012道路 堆优化的dijkstra+pair

    From Tyvj Guest ☆[haoi2012]道路                 描述 Description     C国有n座城市,城市之间通过m条单向道路连接.一条路径被称为最短路,当 ...

  2. 按考分对学生排序 Exercise08_03

    /** * @author 冰樱梦 * 时间:2018年12月 * 题目:按考分对学生排序 * */ public class Exercise08_03 { public static void m ...

  3. 普及向 ZKW线段树!

    啊,是否疲倦了现在的线段树 太弱,还递归! 那我们就欢乐的学习另外一种神奇的线段树吧!(雾 他叫做zkw线段树   这个数据结构灰常好写(虽然线段树本身也特别好写……) 速度快(貌似只在单点更新方面比 ...

  4. Unity 的一些特性

    using System; using UnityEngine; using UnityEditor; using UnityEngine.Serialization; using Random = ...

  5. MSChart使用小结

        在用到图表展示某项.多项信息的统计情况,很正常联想到MSChart控件.        以VS2008开发为例,在工具箱也中右击,选择”choose items“,打开对话框,选择COM组件T ...

  6. 查看linux并发连接数的方法

    查看Web服务器(Nginx Apache)的并发请求数及其TCP连接状态:netstat -n | awk '/^tcp/ {++S[$NF]} END {for(a in S) print a, ...

  7. Ubuntu 16.04安装uafred用于替代Alfred

    说明: Macx下的Alfred非常强大,在Ubuntu下的替代为uafred,为什么选择uafred而不选择其它在于其功能开发简单,模块集成方便,不像别的实现是那种来回封装调用,其实就是一个功能而已 ...

  8. eclipse的项目和配置文件 .project .cproject .classpath .metadata

    eclipse CDT建立project后在project name对应的目录下面会生成.project和.cproject两个隐藏文件. eclipse  java建立project后在projec ...

  9. Android中MVC模型(复合模式)

    mvc是model,view,controller的缩写,mvc包括三个部分: 1.模型(model)对象:是应用程序的主体部分,全部的业务逻辑都应该写在该层. 2.视图(view)对象:是应用程序中 ...

  10. JVM:如何分析线程堆栈

    英文原文:JVM: How to analyze Thread Dump 在这篇文章里我将教会你如何分析JVM的线程堆栈以及如何从堆栈信息中找出问题的根因.在我看来线程堆栈分析技术是Java EE产品 ...