Question

我有一个React-Redux应用程序，正在构建更新功能。我有状态列表，并更新其中一个。成功的更新API调用将更新的绘图作为响应。如何用状态中更新的绘图替换旧绘图？

现在，这是我的减速机。我看到更新的情节被记录，但除非我重新加载，否则它不会被替换。我总是可以在成功时触发从后端重新加载整个情节列表，但是希望避免不必要的调用。

case UPDATED_PLOT:
            action.payload.id = action.payload._id;
            console.log('updated plot received by reducer: ', action.payload);
            return {
                ...state,
                filteredPlots: state.filteredPlots.map(
                    plot => (plot.id == action.payload.id ? action.payload : plot)
                )
            };

Answer 1

试试这个：

case UPDATED_PLOT:
    action.payload.id = action.payload._id;
    const new_filtered_plots = state.filteredPlots.map(plot => {
       return plot.id == action.payload.id ? action.payload : plot
    });
    return Object.assign({}, state, {filteredPlots: new_filtered_plots});

Answer 2

你的减速机代码对我来说很好。你是如何得出结论，redux状态注意到了更新？您是否尝试过安装redux-dev-tools以确保状态尚未更新？

如果您确定状态已更新，则可能需要检查您的组件是否已重新渲染。您可以在特定组件中检测componentWillUpdate（）。此外，它值得检查react-redux的文档，尤其是“纯”选项。

Redux-根据后端返回更新数组中的一个元素

2 个答案: