您的位置:首页 > 其它

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

2015-12-02 02:18 459 查看
Learn how to implement toggling 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
}
];
case 'TOGGLE_ITEM':
return state.map( (todo) => {
if(todo.id !== action.id){
return todo;
}else{
return {
...todo,
completed: !todo.Completed// will overwirte the todo object's completed prop
};
}
})
default:
return state;
}
};

let testTodo_addItem = () => {
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);
};

let testTodo_toggleItem = () => {
let stateBefore = [
{
text: 'Learn Redux',
id: 0,
completed: false
},
{
text: 'Learn Angular2',
id: 1,
completed: false
}
];
let action = {
type: 'TOGGLE_ITEM',
id: 1
};

let stateAfter = [
{
text: 'Learn Redux',
id: 0,
completed: false
},
{
text: 'Learn Angular2',
id: 1,
completed: true
}
];

deepFreeze(stateBefore);
deepFreeze(action);

expect(
todo(stateBefore, action)
).toEqual(stateAfter);
}

testTodo_toggleItem();

console.log("All tests passed!");
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: