在redux

时间:2017-12-04 09:32:16

标签: reactjs redux react-redux

我在我的反应项目中使用了redux。我的问题是当一些使用状态完成的作品时如何清除状态。

例如,我的redux商店中有search状态。

search:{
  status: 'INIT',
  result: [],
}

由于我的搜索是异步请求,因此它有status字段。

当用户搜索某个字时,它会发送“FETCH_SEARCH”字样。将状态设为' LOADING'。

完成提取后,它会发送“SUCCESS_SEARCH”'或者' FAILURE_SEARCH'制作地位' SUCCESS'或者'失败'。

在显示搜索结果的组件中,它呈现的内容取决于search州的状态。如果状态为“成功”,则会呈现搜索结果。

到目前为止,没有问题。

但是,如果用户之前搜索过并尝试在某些作品后再次搜索该怎么办?由于用户之前已成功搜索过,因此search州已成功搜索成功'州。因此,我的组件将呈现“不需要的”#39;结果。

目前,我发送了' CLEAR_SEARCH'初始化search州的行动。

我的问题是如何在提交完成后清除redux状态。 我做得对吗?还是反模式?

1 个答案:

答案 0 :(得分:4)

之前我已经完成了这项工作,我所做的就是遵循工作流程。

提交搜索后,您不应该清除状态。您应该在用户再次搜索时重置它。

假设用户搜索“Term A”。您设置了“SEARCH_SUCCESS”,它正在渲染结果。当他再次搜索时,将该状态设置为“搜索”或“加载”。

如果您有类似

的内容,请使用渲染方法
// etc..

if (isLoading) {
  return <LoadingComponent />
}

// etc..

在渲染任何结果之前,您将渲染加载。然后,您的搜索操作应设置 SUCCESS FAILURE ,如果您的组件正确映射,则应该非常简单。

修改

在评论部分进行简短讨论之后,您只想在开始时(首次渲染时) INIT ,但仍然重置状态。

所以你可以选择这个工作流程:

第一次: - &GT; INIT - &gt; SEARCH_TRIGGERED - &gt;加载 - &gt;成功或失败

第二次(仍然在同一个屏幕上): - &GT; SEARCH_TRIGGERED - &gt;加载 - &gt;成功或失败

然后你会有所需的工作流程。

希望我帮助