我是redux的新手，所以如果这是一个愚蠢的问题，我道歉。我有一个react应用程序，我正在添加redux存储到它。我正在使用thunk中间件来执行异步代码，从后端获取/保存数据。
我在index.js中有以下内容：store.dispatch(loadInitialState());loadInitialState()调用后端服务并加载初始数据，并分派动作以加载初始状态：
dispatch({
type: LOAD_INITIAL_STATE,
payload: initData,
});现在，如果事情不顺利，我会分派一个set error操作，如下所示：
dispatch({ type: SET_ERROR_MESSAGE, payload: errorMessage });而减速器是这样的：
case actions.SET_ERROR_MESSAGE:
return {
...state,
error: action.payload,
};
case actions.RESET_ERROR_MESSAGE:
return {
...state,
error: null,
};我有一个名为<DisplayError />的组件，我已经将其包含在顶部的App.js中，在应用程序的每个页面上，此组件将是第一个呈现的组件，它使用useSelector(state => state.error)来查找是否存在，并显示一个错误。
问题是：如果我在某个路径/页面上遇到错误，并且如果我离开了该路径，错误消息仍会留在那里，因为该组件在所有页面的顶部都是常见的。我认为解决此问题的唯一方法是在应用程序中的所有位置执行dispatch({ type: RESET_ERROR_MESSAGE, payload: null });，以确保错误消息不会出现在不应该出现的位置。
在redux状态下设置的错误复位方法是什么？
1条答案
按热度按时间s8vozzvw1#
∮一些事情... ∮
Redux存储与路由没有关系，这是Redux存储的全部功能，所以到处都有数据。如果你有一个组件监视存储中所有页面的错误消息，那么要么该组件必须处理显示错误的路由，要么你必须在错误消息显示后（或导航离开时）调用reset。
那么正确的方法是什么？
好吧，在我看来，"正确"的方式是回调，当谈到查询。这：react-query-v3.tanstack.com/guides/queries设置了一个相当不错的标准IMO。可以这样想：错误是你需要向用户显示的消息的本地示例。所以你应该显示它们，但不一定要把它们存储在你的数据存储中。所以你使用回调，以你想要的方式发出警报，就这样。
"好的，那么好的做法是将所有API调用都保留在组件中，然后分派相关的redux操作？"
在我看来，是的。隔离和可重用性至少一直在我的脑海中。
"我需要了解的一个情况是，有一个组件在主页上显示数据库中的数据，而我在App.js中发送了一个thu ..."
简短的回答是：您不应该在App.js中这样做，而应该在特定于该数据的组件中这样做，在该组件中您将管理它的生命周期，包括错误。
即使它是在整个应用程序中可见的东西，这也适用。
良好的卫生保持东西隔离IMO。