React 钩子：useEffect` 为什么？ [关闭]答案

【问题标题】：React hooks: useEffect` why? [closed]React 钩子：useEffect` 为什么？ [关闭]
【发布时间】：2021-01-13 23:18:31
【问题描述】：

关于新提议的 https://reactjs.org/docs/hooks-reference.html#useeffect

Effect hook (useEffect()) 有哪些优点和用例？
为什么更可取以及它有何不同 componentDidMount/componentDidUpdate/componentWillUnmount （性能/可读性）？

文档指出：

函数组件的主体（称为 React 的渲染阶段）中不允许使用突变、订阅、计时器、日志记录和其他副作用。

但我认为在 componentDidUpdate 等生命周期方法中而不是在渲染方法中具有这些行为已经是常识

还有人提到：

传递给 useEffect 的函数将在渲染提交到屏幕后运行。

但这不就是 componentDidMount 和 componentDidUpdate 做的吗？

【问题讨论】：

也许这可以帮助你stackoverflow.com/questions/53062732/…
好问题！

标签： javascript reactjs react-hooks

【解决方案1】：

我认为您可以将函数式组件用于几乎所有的事情。而且即使你不能使用传统的 react，你也可以使用一些 npm 包来实现你想要做的事情。此外，功能组件比类组件更有组织和更清晰。我会把钱押在功能组件上。

【讨论】：

【解决方案2】：

你可以根据你的情况同时使用这两个兄弟但是 react hooks 比 class 复杂得多
如果你不新鲜就使用钩子会更好。它比类组件新

【讨论】：

【解决方案3】：

只要你了解生命周期背后的主要概念，就可以使用它

【讨论】：

【解决方案4】：

当代的 React 应用程序主要使用功能组件和在某些非常特殊的情况下（或遗留代码）的类组件，它们确实提供对生命周期方法的显式访问，例如 componentDidMount、componentDidUnmount 等。新闻钩子（例如 useLayoutEffect 等）是在我看来，基本上可以替代其中一些生命周期方法，并且在 95% 的情况下就足够了。

钩子的缺点通常是依赖数组，有时可能需要使用另一个钩子（如 useMemo）进一步提取值，然后可以静态检查，而不是使用 dep 数组中的表达式 - 实际上这会引发警告。

但归根结底，这实际上取决于您要实现什么，以及您是否能找到适合您用例的正确钩子（很多时候是自定义钩子）。

【讨论】：