Learn how to implement adding a todo in a todo list application reducer.

let todo = (state = [], action) => {

  switch(action.type){
case 'ADD_ITEM':
return state = [
...state,
{
text: action.text,
id: action.id,
completed: false
}
];
default:
return state;
}
}; let testTodo = () => {
let stateBefore = [];
let action = {
type: 'ADD_ITEM',
text: 'Learn Redux',
id: 0
};
let stateAfter = [
{
text: 'Learn Redux',
id: 0,
completed: false,
}
]; deepFreeze(stateBefore);
deepFreeze(action); expect(
todo(stateBefore, action)
).toEqual(stateAfter);
}; testTodo(); console.log("All tests passed!");

[Redux] Writing a Todo List Reducer (Adding a Todo)的更多相关文章

  1. [Redux] Writing a Todo List Reducer (Toggling a Todo)

    Learn how to implement toggling a todo in a todo list application reducer. let todo = (state = [], a ...

  2. [Redux] React Todo List Example (Adding a Todo)

    Learn how to create a React todo list application using the reducers we wrote before. /** * A reduce ...

  3. [Redux] React Todo List Example (Toggling a Todo)

    /** * A reducer for a single todo * @param state * @param action * @returns {*} */ const todo = ( st ...

  4. [Redux] Reducer Composition with Arrays

    In the previous lesson we created a reducer that can handle two actions, adding a new to-do, and tog ...

  5. [Redux] React Todo List Example (Filtering Todos)

    /** * A reducer for a single todo * @param state * @param action * @returns {*} */ const todo = ( st ...

  6. [Redux] Extracting Presentational Components -- Todo, TodoList

    Code to be refactored: let nextTodoId = 0; class TodoApp extends Component { render() { const { todo ...

  7. 实例讲解react+react-router+redux

    前言 总括: 本文采用react+redux+react-router+less+es6+webpack,以实现一个简易备忘录(todolist)为例尽可能全面的讲述使用react全家桶实现一个完整应 ...

  8. Redux你的Angular 2应用--ngRx使用体验

    Angular2和Rx的相关知识可以看我的Angular 2.0 从0到1系列第一节:Angular 2.0 从0到1 (一)第二节:Angular 2.0 从0到1 (二)第三节:Angular 2 ...

  9. [Redux] Normalizing the State Shape

    We will learn how to normalize the state shape to ensure data consistency that is important in real- ...

随机推荐

  1. iOS开发之通知中心(NSNotificationCenter)

    前言 面向对象的设计思想是把行为方法封装到每一个对象中,以用来增加代码的复用性.正是这种分散封装,增加了对象之间的相互关联,总是有很多的对象需要彼此了解以及相互操作! 一个简单示例说明这种交互产生的对 ...

  2. openssl 使用非阻塞 bio

    序 在项目中需要访问 https 加密的网页,为了保证并发性,需要用到非阻塞的 socket,搜索发现,这种使用场景的相关介绍不是很多,所以这里记录一下使用的过程. 在项目中,所使用的 ssl 库是老 ...

  3. qt实现类似QQ伸缩窗口--鼠标事件应用

    原创文章,引用请保证原文完整性,尊重作者劳动,原文地址http://blog.csdn.net/hiwubihe/article/details/38678305,qq:1269122125. 上一章 ...

  4. VS2012 ActiveX控件_D接口添加方法事项

    自己写的是Clock控件,所以控件的接口是_DClock 使用向导添加方法后,会在紫色区域自动生成红色代码:(添加Hello方法) dispinterface _DClock { properties ...

  5. 跟我一起学CMake

    如今CMake使用的人数越来越多,包括我项目组里,很多大牛们在写Qt程序的时候都不用自带的qmake,貌似会出现很多问题,他们往往都用自己写的CMake来编译系统,今天我也和大家一起来学学这个高大上的 ...

  6. mysql启动不了:ERROR 2002 (HY000): Can’t connect to local MySQL server through socket

    ps aux |grep mysql kill所有列出的进程,然后重启 service mysql start 原因有可能是mysqld没启动:service mysqld start. 持续出现此问 ...

  7. Eclipse中使用Maven创建Servlet3.0 Web 项目

    摘要 Apache Maven是一个优秀的项目构建和管理工具,许多开源项目都使用Maven进行构建.由于最近工作中要用到Maven,于是这里记录下在Eclipse中使用Maven插件创建一个基于Ser ...

  8. d037: 鸡兔同笼

    内容: 鸡兔同笼中头的总数,脚的总数,求鸡兔各多少只 输入说明: 一行两个整数分别表示头.脚总数(保证有解,当然有可能解为0) 输出说明: 一行两个整数,分别表示鸡.兔的只数 输入样例:   20 4 ...

  9. Delphi 写日志的类

    unit uProgLog; interface uses Windows, SysUtils, SyncObjs; const C_LOG_LEVEL_TRACE = $; C_LOG_LEVEL_ ...

  10. cf700A As Fast As Possible

    On vacations n pupils decided to go on excursion and gather all together. They need to overcome the ...