Redux 状态不会更新答案

【问题标题】：Redux state won't updateRedux 状态不会更新
【发布时间】：2021-10-17 08:15:34
【问题描述】：

我正在使用 Redux，并在我拥有的列表中实现了删除功能。当用户删除一个项目时，我会向 reducer 发送一个delete 调用，这样我就可以从列表中删除已删除的项目。但是，状态不会更新（该项目仍在数组中）但我不知道为什么。

这就是我发送删除调用的方式：

const onDismiss = useCallback(g => {
  console.log(store.getState().reducer.goals);
  dispatch(deleteGoal(g.id));
  setTimeout(() => {
    console.log(store.getState().reducer.goals);
  }, 2000);
}, []);

这是 deleteGoal 操作：

export const deleteGoal = (id) => {
    return (dispatch) => {
        dispatch({
            type: ActionType.deleteGoal,
            payload: id
        })
    }
}

这是减速器：

case ActionType.deleteGoal:
    return {
        ...state,
        goals: state.goals.filter((goal: any) => goal.id !== action.id)
    }

这是初始状态：

const initialState = {
    goals: <any>[],
}

【问题讨论】：

简单。从 ... !== action.id 更改为 !== action.payload.id

标签： react-native redux

【解决方案1】：

问题出在你的减速器上

goals: state.goals.filter((goal: any) => goal.id !== action.id)

应该改为action.payload

goals: state.goals.filter((goal: any) => goal.id !== action.payload)

是否是action.xx，这取决于您在action中发送的内容

dispatch({
            type: ActionType.deleteGoal,
            payload: id
        })

由于您将id 存储在payload 中，因此在您的减速器中您将需要action.payload

【讨论】：

【解决方案2】：

将action.id 更改为action.payload

case ActionType.deleteGoal:
    return {
        ...state,
        goals: state.goals.filter((goal: any) => goal.id !== action.payload)
    }

【讨论】：