redux在react-native上使用(五)--redux-actions使用

2024年5月29日 287次阅读 来源: laowen

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

createAction

原来创建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);
    原文作者：laowen
    原文地址: https://segmentfault.com/a/1190000008767283
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞