Reflux之Action
reflux在flux的基础上,去掉了dispatcher.
在Reflux中,每一个Action本身就是一个Publisher
(消息发布者),具有消息发布功能;而每一个Store除了作为数据存储之外,它还是一个Subscriber
,或者叫做Listener
(消息订阅者),可以通过监听Action,来获取到变化的数据。
const Reflux = require('reflux'); const action = Reflux.createAction();
action.listen(data => console.log('data1 is ', data));
action.listen(data => console.log('data2 is ', data));
// 同步触发
action.trigger('sync');
// 异步触发
// setTimeout(() => {
// action.trigger('async')
// }, 0); action.triggerAsync('async2') console.log('-----end-----');
Reflux hooks
const Reflux = require('reflux'); const action = Reflux.createAction({
preEmit(data) {
return {
name: data
}
},
shouldEmit() {
// 若为false,则不会触发
return true;
}
}) action.listen(data => console.log(data)); action.trigger('flower');
异步串联 asyncResult
const Reflux = require('reflux'); const action = Reflux.createAction({asyncResult: true, children:['clickme']}); action.completed.listen(function() {
console.log('complete');
}) action.clickme.listen(function() {
console.log('click me');
action.completed();
}); action.listen(function(data) {
console.log(data);
action.clickme();
}); action.trigger('hello')
createActions
const Reflux = require('reflux'); const actions = Reflux.createActions(['action1', 'action2']); actions.action1.listen(data => console.log('in action1, ', data));
actions.action2.listen(data => console.log('in action2, ', data));
actions.action1.listen(data => console.log('in action1, ', data)); actions.action1.trigger('heel');
actions.action2.triggerAsync('mount');
action1.listen对应action1.trigger, action2.listen对应action2.triggerAsync.
Reflux之Action的更多相关文章
- react 之 reflux 填坑
注意:老铁些,在看这篇文章的之前,最好了解一下react 的全局状态管理库哦,不然可能会坐飞机. ^_^ React 之reflux (它是一个功能模块,需要安装引入): import Reflux ...
- Reflux之Store
Reflux中的Store既是一个listener(既有对action的监听,又有对store的监听)同时又是一个publisher. 一.监听单个action const Reflux = requ ...
- react+reflux入门教程
为了简化react的flux带来的冗余操作,社区的同仁们给我们带来了很多优秀的轮子,诸如redux,reflux等.今天我们就通过逐行讲解代码实例的方法,感受一番reflux的设计之美. 例子 这个例 ...
- 【原创】ReFlux细说
ReFlux细说 Flux作为一种应用架构(application architecture)或是设计模式(pattern),阐述的是单向数据流(a unidirectional data flow) ...
- React + Reflux
React + Reflux 渲染性能优化原理 作者:ManfredHu 链接:http://www.manfredhu.com/2016/11/08/23-reactRenderingPrinc ...
- Reflux 使用教程
Reflux是根据React的flux创建的单向数据流类库.Reflux的单向数据流模式主要由actions和stores组成.例如,当组件list新增item时,会调用actions的某个方法(如a ...
- Reflux中文教程——概览
翻译自github上的reflux项目,链接:https://github.com/reflux/refluxjs 〇.安装及引入 安装: npm install reflux 引入: var Ref ...
- Reflux系列01:异步操作经验小结
写在前面 在实际项目中,应用往往充斥着大量的异步操作,如ajax请求,定时器等.一旦应用涉及异步操作,代码便会变得复杂起来.在flux体系中,让人困惑的往往有几点: 异步操作应该在actions还是s ...
- React + Reflux 渲染性能优化原理
作者:ManfredHu 链接:http://www.manfredhu.com/2016/11/08/23-reactRenderingPrinciple 声明:版权所有,转载请保留本段信息,否则请 ...
随机推荐
- Java Web教程——检视阅读
Java Web教程--检视阅读 参考 java web入门--概念理解.名词解释 Java Web 教程--w3school 蓝本 JavaWeb学习总结(一)--JavaWeb开发入门 小猴子mo ...
- python学习笔记(五)---函数与类
函数 def为定义函数的一个标志 demo1: def greet_user(username): print("Hello, " + username.title() + &qu ...
- 2019-2020-1 20199329《Linux内核原理与分析》第十三周作业
<Linux内核原理与分析>第十三周作业 一.本周内容概述 通过重现缓冲区溢出攻击来理解漏洞 二.本周学习内容 1.实验简介 注意:实验中命令在 xfce 终端中输入,前面有 $ 的内容为 ...
- Apache Commons Lang » 3.10使用简介
============================================================= 行文介绍: 1.诞生背景 2.引入方案 3.简单介绍 4 .详情介绍 文档: ...
- NodeJS反向代理websocket
如需转载请标明出处:http://blog.csdn.net/itas109QQ技术交流群:129518033 文章目录NodeJS反向代理websocket@[toc]前言代码相关问题:1.http ...
- 数学--数论--随机算法--Pollard Rho 大数分解算法 (带输出版本)
RhoPollard Rho是一个著名的大数质因数分解算法,它的实现基于一个神奇的算法:MillerRabinMillerRabin素数测试. 操作流程 首先,我们先用MillerRabinMille ...
- 虚拟 IP 设为静态 IP
一:虚拟机设置桥接模式 1.进入虚拟机设置中将网络适配器设置成桥接模式 2.编辑--虚拟网络编辑器--选择桥接 二:将虚拟IP设置成静态IP (1)方案一:进入虚拟机系统 System 设置 (2)方 ...
- MySQL 8.0.20 源码安装数据库软件
官方支持的平台: https://www.mysql.com/support/supportedplatforms/database.html
- python post protobuf
本文主要讲述如何使用Python发送protobuf数据. 安装protobuf .tar.gz cd protobuf- ./configure make make install 安装成功. // ...
- awk调用date命令
创建文件date.awk: $ == { cmd = "\"" while (cmd | getline line) { print line } close(cmd) ...