子组件应该有状态吗？
假设我们有父组件App，它有一个子组件Search。
对于这个例子：
Search组件通过setState显示输入字段中键入的文本，即：
const Search = () => {
const [searchTerm, setSearchTerm] = React.useState("");
const handleChange = (event) => {
setSearchTerm(event.target.value);
};
return (
<div>
<label htmlFor="search">Search: </label>
<input id="search" type="text" onChange={handleChange} />
<p>
Searching for <strong>{searchTerm}</strong>.
</p>
</div>
);
};方法1:让子组件Search有自己的状态。
Search组件是否应该有自己的状态，即使用UseState()？或者这是个糟糕的做法？
方法2:让父组件App管理子组件的状态。
是否应该将来自Search组件的值传递给父组件App，然后让App组件通过setState()管理状态，然后将更新的值向下传递给搜索组件？
哪种方法是更好的练习方法？
编辑：
我不知道为什么这个问题被标记为基于意见的问题。我知道会有一些分歧，但当一个问题围绕着使用正确的设计模式时，这肯定会发生。如果您不同意，那么为什么不标记围绕使用哪种设计模式的所有堆栈溢出问题，或者将“正确的SQL数据库/表使用”作为基于意见的问题。
回答 4
Stack Overflow用户
发布于 2022-06-03 07:58:19
作为一项经验法则，国家应该尽可能低层次。进一步提升状态的主要原因是如果需要从多个组件访问状态。
然后，您可以将其举到父级，并将其传递给多个子级。如果需要在许多地方访问状态，则可以使用上下文或其他状态管理库。
Stack Overflow用户
发布于 2022-06-03 07:47:42
如果您需要搜索项目中其他地方的值，那么最好集中管理状态(如果项目较小)或使用useContext钩子。否则，如果Search组件只需要值，那么最好在组件本身中管理状态。
Stack Overflow用户
发布于 2022-06-03 07:52:09
首先，你的项目需要什么？事实上，你是在就这个问题采取行动。如果父组件将在app.js中使用状态，则应将状态传递给父组件。但是如果不需要，您应该在子组件中使用setState。
https://stackoverflow.com/questions/72486207
复制相似问题
腾讯云开发者
