【14】redux 之 redux-actions

redux-actions有两大法宝createAction和handleActions.

createAction

http://www.jianshu.com/p/6ba5cd795077

原来创建action:

const startAction = () => ({ type: START });

使用redux-actions创建action:

import { createAction } from 'redux-actions';

const startAction = createAction(START);

handleActions

原来reducer操作state写法要使用switch或if else来匹配:

function timer(state = defaultState, action) {

  switch (action.type) {

    case START:

      return { ...state, runStatus: true };

    case STOP:

      return { ...state, runStatus: false };

    case RESET:

      return { ...state, seconds: 0 };

    case RUN_TIMER:

      return { ...state, seconds: state.seconds + 1 };

    default:

      return state;

  }

}

使用redux-actions``reducer操作state:

const timer = handleActions({

  START: (state, action) => ({ ...state, runStatus: true }),

  STOP: (state, action) => ({ ...state, runStatus: false }),

  RESET: (state, action) => ({ ...state, seconds: 0 }),

  RUN_TIMER: (state, action) => ({ ...state, seconds: state.seconds + 1 }),

}, defaultState);

http://blog.csdn.net/sinat_17775997/article/details/70176723

巴特西

【14】redux 之 redux-actions

createAction

handleActions

最新文章

热门文章