redux-demo

redux-demo.js

import { combineReducers, createStore } from 'redux'
var objectAssign = require('object-assign');

// Action
const ADD_CART = 'ADD_CART';
const SET_GOODS_COLLECT = 'SET_GOODS_COLLECT';

function addToCart(goods) {
  return {
    type: ADD_CART,
    goods
  };
}

function collectGoods() {
  return {
    type: SET_GOODS_COLLECT
  };
}

// reducers
var initGoods = {"id": 123, "name": "星战正版机器人BB-8", isCollect: false};
function goods(state = initGoods, action) {
  switch (action.type) {
    case SET_GOODS_COLLECT:
      return objectAssign({}, state, {isCollect: !state.isCollect});

    default:
      return state;
  }
}

var initCarts = [];
function carts(state = initCarts, action) {//es6 特性
  switch (action.type) {
    case ADD_CART:
      return [...state, action.goods];//es6 特性
    default:
      return state;
  }
}

const rootReducer = combineReducers({
  goods,
  carts
});

let store = createStore(rootReducer);

console.log(store.getState());
store.dispatch(collectGoods());
console.log(store.getState());

store.dispatch(addToCart({"id": 124, "name": "星战正版机器人BB-8", isCollect: false}));
console.log(store.getState());
store.dispatch(addToCart({"id": 125, "name": "星战正版机器人BB-10", isCollect: false}));
console.log(store.getState());

http://km.oa.com/files/photos/pictures/201601/1452332110_16_w476_h738.png