[Cycle.js] Customizing effects from the main function
How can we show one string on the DOM, and a completely different string on Console log? This lesson shows how we can make our main function return multiple Observables, each one targeted at a different type of effect.
// Logic (functional)
function main() {
return {
DOM: Rx.Observable.timer(0, 1000).map( i => `timer is ${i}`),
Log: Rx.Observable.timer(0, 1000).map(i => 2*i )
};
i} function DOMEffect(text$) {
text$.subscribe(text => {
const container = document.querySelector('#app');
container.textContent = text;
});
} function consoleLogEffect(msg$) {
msg$.subscribe(msg => console.log(msg));
} const sinks = main();
DOMEffect(sinks.DOM);
consoleLogEffect(sinks.Log);
[Cycle.js] Customizing effects from the main function的更多相关文章
- [Cycle.js] Read effects from the DOM: click events
So far we only had effects that write something to the external world, we are not yet reading anythi ...
- [Cycle.js] Main function and effects functions
We need to give structure to our application with logic and effects. This lessons shows how we can o ...
- The App Life Cycle & The Main Function
The App Life Cycle Apps are a sophisticated interplay between your custom code and the system framew ...
- [Cycle.js] The Cycle.js principle: separating logic from effects
The guiding principle in Cycle.js is we want to separate logic from effects. This first part here wa ...
- [Cycle.js] Generalizing run() function for more types of sources
Our application was able to produce write effects, through sinks, and was able to receive read effec ...
- [Cycle.js] From toy DOM Driver to real DOM Driver
This lessons shows how we are able to easily swap our toy DOM Driver with the actual Cycle.js DOM Dr ...
- 学习RxJS:Cycle.js
原文地址:http://www.moye.me/2016/06/16/learning_rxjs_part_two_cycle-js/ 是什么 Cycle.js 是一个极简的JavaScript框架( ...
- [Cycle.js] Fine-grained control over the DOM Source
Currently in our main() function, we get click$ event. function main(sources) { const click$ = sour ...
- [Cycle.js] Hello World in Cycle.js
Now you should have a good idea what Cycle.run does, and what the DOM Driver is. In this lesson, we ...
随机推荐
- CCSpawn使用CCRepeatForever无效
在使用CCSpawn中加入CCRepeatForever,但却无法使用CCRepeatForever的效果. CCActionInterval* action =(CCActionInterval*) ...
- cocos2dx 帧动画(iOS)
植物大战僵尸的植物摇摆效果 //帧动画 Animation *animation = Animation::create(); Sprite *sprite = Sprite::create(&quo ...
- 在OC中调用Swift类中定义delegate出现:Property 'delegate' not found on object of type ...
找了许久没找到答案, 在下面的链接中, 我解决了这个问题: http://stackoverflow.com/questions/26366082/cannot-access-property-of- ...
- windows下配置lamp环境(3)---配置PHP5.4
下面配置php Php文件夹里有两个php.ini-*文件,随便修改一个,去掉后缀,变成php.ini (如图) 打开php.ini ,添加php扩展目录723行左右(其实放哪都无所谓,只不过php. ...
- syscall 中断号
#ifndef __ASM_ARM_UNISTD_H #define __ASM_ARM_UNISTD_H #define __NR_OABI_SYSCALL_BASE 0x900000 #if de ...
- GCD 深入理解
GCD 深入理解(一) 虽然 GCD 已经出现过一段时间了,但不是每个人都明了其主要内容.这是可以理解的:并发一直很棘手,而 GCD 是基于 C 的 API ,它们就像一组尖锐的棱角戳进 Object ...
- Servlet 中的out.print()与out.writer()的区别
PrintWriter out = response.getWriter(); out.print(obj)其源码如下: public void print(Object obj) { write(S ...
- controller 和 指令 通讯方法
在 angular 中我们经常会使用多个 controller 和 指令 他们拥有各自的 $scope , 这就产生了跨$scope调用的问题. 有几种常见的方法来可以使用. 方法一 : 指令 req ...
- poj1704
题目大意:n个石子,每次可以取一个石子向左移动,左边有边界限制,每个位置最多同时放一个石子,求先手必胜还是必败. 首先,我们将石子两两配对,每一对,若是先手可以将左边的向左移动一格,则可以用后手将右边 ...
- GDB调试GCC(jRate)
1.前提是build GCC的时候要修改makefile,在configure之后生成的makefile忠,将CFLAGS和CFLAGS_FOR_BUILD改成-g3 -O0.. 2.在root用户下 ...