redux-thunk action中请求接口,reducer中处理type,return state 视图不更新

缓缓
  • 1.3k

在 action-types.js 中定义

// 获取提现记录
export const GETCASHLIST = 'GETCASHLIST'

在action.js中定义action

// 获取提现记录列表,保存至redux
export const getCashList = () => {
  return async dispatch => {
    try{
      const value = await API.getCashList();
      dispatch({
        type: GETCASHLIST,
        value,
        initLoading:false
      })
    }catch(err){
      console.error(err);
    }
  }
}

在reducer.js中根据类型返回

export const cashInfo = (state = defaultState , action = {}) => {
  switch(action.type){
    case GETCASHLIST:
    state.cashList = [...action.value]
    state.initLoading = action.initLoading
    return {...state}
    case ADDTOCASHLIST:
      state.cashList.unshift(action.value);
      return state;
    case RESETUSEMONEY:
      state.usefulMoney = action.value;
      return state;
    default:
      return state;
  }
}

上述reducer。js中 case GETCASHLIST: return state 无法更新视图 return {...state} 视图就可以更新
想问一下是为什么

具体项目地址:https://github.com/yuanyuansh...

回复
阅读 1.2k
2 个回答

不要直接修改state,而是返回新的state:

case RESETUSEMONEY:
  return {...state,usefulMoney : action.value};

redux 会进行 浅比较

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏