使用 react-redux 时可以直接更新 react 组件中的状态吗？

Question

我在网络上看到一些例子，人们在组件本身中使用函数调用处理点击事件，然后通过执行基本操作直接更改状态，例如：

saveCourse(event) {
  this.setState({saving: true});
}

我曾认为在使用 react-redux 时，根据操作调用在 reducer 中进行所有状态更改很重要。

如果我不知何故错过了 react-redux 的常见使用模式，请告诉我。

Answer 1

继续使用 React 自己的 State 机制和 Redux store 是完全没问题的。

以下是我如何理解这两个选择：如果一段数据（以及发生在它身上的变化）是单个组件及其直接子组件的本地数据，请使用 State。以通常使用 React 的方式更新它。

如果一条数据要跨你的应用使用，在可能驻留在同一个组件树中也可能不在同一个组件树中的各种组件中，或者可能被各种中间组件相互分隔开的情况下，那么使用Redux，所以您最终不会在链上上下传递 props 和处理程序回调。

这里有一个例子可以说明这一点：假设你的 Redux 商店中有一个 Contacts 列表。还有一个 addContact reducer，用于将新联系人添加到此列表中。此列表中的项目可能会在您的应用程序中以各种形状和位置显示。例如，侧栏上的菜单项可能会显示列表中的项目数，而主面板中的另一个 div 可能会列出项目及其详细信息。目前一切顺利。

现在，您需要创建一个 NewContact 组件来呈现表单和必要的输入字段，让用户将新联系人添加到列表中。此表单上的输入可以是 Controlled Components，更新 NewContact 组件的内部状态，完全绕过 Redux 存储。提交表单后，您的组件将使用适当的有效负载发送一个 addNewContact 操作，此时新联系人将通过 Redux 机制添加到列表中，将必要的更新传播到您的应用程序的其余部分。

这是同时混合使用 Redux Store 和 React State 的有效示例。

现在，您是否也可以在 Redux 中管理 NewContact 表单的状态？ Absolutely！但是你应该吗？您的来电。您不必这样做，除非这样做有一些好处。

Answer 2

在 redux 中管理状态并不意味着你不能在 react 中使用 Stateful 组件，你主要使用 setState 来 re-render 组件并接收新的道具。虽然我使用 this.forceUpdate 到 re-render。但是设置状态似乎更好

Answer 3

setState 正在更改您的本地组件的状态，如果您要更改的范围仅在您的组件本地而不是在您的应用程序中，则更改本地状态没有错。对于前。 showing/hiding 模式，或更改某种 UI 元素，如果您重新加载页面，这些元素将不会持续存在，例如 opening/closing 下拉菜单。

使用 react-redux 时可以直接更新 react 组件中的状态吗？

OK to update state in react components directly when using react-redux?

reactjs

redux

react-redux-form