标签：pen const shared splay ret clu close return anti
1. include createStore
import { createStore } from ‘redux‘
2. Establish reducer
const reducerName = (state, action) => {
state;
}
3. invoke createStore()
const store = createStore(reducerName);
code:
import { createStore } from ‘redux‘;
const reducer = (state, action) => {
switch (action.type) {
case ‘ADD_RECIPE‘:
return Object.assign(
{}, state, {
recipes: state.recipes.concat({name : action.name})
});
}
return state;
}
// https://s3.amazonaws.com/500tech-shared/db.json
const initialState = {
"recipes": [
{
"name": "Omelette"
},
{
"name": "Waffle"
}
],
"ingredients": [
{
"name": "Eggs",
"quantity": 2,
"measure": "large",
"recipe": "Omelette"
},
{
"name": "Eggs",
"quantity": 1,
"measure": "large",
"recipe": "Waffle"
},
{
"name": "Milk",
"quantity": 1,
"measure": "cups",
"recipe": "Waffle"
},
{
"name": "Sugar",
"quantity": 2,
"measure": "tbsp",
"recipe": "Waffle"
}
]
}
const store = createStore(reducer, initialState);
console.log(store.getState());
store.subscribe(()=>(console.log("store change")));
store.dispatch({type:‘ADD_RECIPE‘, name: ‘xiaobin‘});
console.log(store.getState());
db.json
{ "recipes": [ { "name": "Omelette" }, { "name": "Waffle" } ], "ingredients": [ { "name": "Eggs", "quantity": 2, "measure": "large", "recipe": "Omelette" }, { "name": "Eggs", "quantity": 1, "measure": "large", "recipe": "Waffle" }, { "name": "Milk", "quantity": 1, "measure": "cups", "recipe": "Waffle" }, { "name": "Sugar", "quantity": 2, "measure": "tbsp", "recipe": "Waffle" } ] }
标签：pen const shared splay ret clu close return anti
原文地址：https://www.cnblogs.com/xiaobin-hlj80/p/9222520.html
