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. protocol buffer使用简介

    之前在工作中用到了protocol buffer(此处简称PB)(主要对数据进行序列化与反序列化,方便网络传输中的编解码),之后发现这是一个好东西,在此稍微记录下该工具如何使用,方便以后查阅 官网地址 ...

  2. sql问题

    表中某个指标重复,去掉重复项: select * from #temp where A0107 in (select A0107 from #temp  group by A0107having CO ...

  3. 说说oracle的 sysdate、trunc函数

    SQL> select trunc(sysdate)+1/24+3 from dual; TRUNC(SYSDATE)+1/24-------------------2015-08-14 01: ...

  4. 统计机器翻译(SMT)步骤总结

    本文是在Niutrans论坛中的系列教程中总结出来的. 1.语料预处理 预处理的结果是生成双语分词之后的文件,该步需要注意的是对规则短语,比如数字.日期.网址等,进行泛化处理.可以用正则方法或者其它方 ...

  5. OC - 20.多图下载

    效果图 常见问题及解决方法 图片重复下载 将内存保存在内存或沙盒中. 若下载的图片量较大,则会出现UI界面不流畅的现象 在子线程中执行下载操作,然后回到主线程成中进行UI界面的刷新. 由于cell的循 ...

  6. 七、C# 接口

    并非只能通过继承使用多态性,还能通过接口使用它. 和抽象类不同,接口不包含任何实现(方法). 然后和抽象类相似,接口也定义了一系列成员,调用者可以依赖这些成员来支持一个特定的功能.   实现接口的类会 ...

  7. window连接linux nfs服务器 —— 网络错误 53

    在度娘以"win7 nfs mount 网络错误 - 53"为关键字,翻了第一页,GG... 于是去找谷哥,第一页 [all variants] Get NFS working w ...

  8. App Store自动下载WiFi与蜂窝数据切换机制

    写下这个给自己备忘,上次也有一次载了个跟头. 在iOS 7和8里面,除了设置--App Store里面自动更新,自动下载,以及使用蜂窝数据要关之外,别以为用了WiFi挂着程序,就万无一失了. 这种情况 ...

  9. C++11中int,float,double与string的转化

    在C++11中可以使用std::to_string()函数将数值转换为string格式,十分方便. 以下部分来选自cplusplus.com. std::to_string string to_str ...

  10. head First HTML与CSS读书笔记

    调整图片大小 有滚动条的图片可给不了好的用户体验,为了让图片的大小更适合浏览器窗口.这时候就需要对图片的大小进行调整看书之前.我调整图片大小的方式是在<img>元素使用 width 和 h ...