React钩子:useEffect`为什么?

时间:2020-09-28 11:11:59

标签: javascript reactjs react-hooks

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

  1. Effect钩子(useEffect())的优点和用例是什么?
  2. 为什么会更可取? componentDidMount / componentDidUpdate / componentWillUnmount (性能/可读性)?

文档指出:


在功能组件的主体内(称为React的渲染阶段),不允许进行突变,订阅,计时器,日志记录和其他副作用。

但是我认为在生命周期方法(例如componentDidUpdate等)中使用这些行为,而不是使用render方法已经是常识

也有提到:


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

但是那不是componentDidMount和componentDidUpdate做什么吗?

4 个答案:

答案 0 :(得分:1)

我认为您可以将功能组件用于几乎所有内容。即使您不能使用传统的react,也可以使用一些npm软件包来实现您想要的操作。而且,功能组件比类组件更组织,更整洁。 我会把钱押在功能组件上。

答案 1 :(得分:0)

您可以根据情况使用两个兄弟,但是react钩子比class复杂得多
如果您不新鲜,最好使用钩子。它比类组件新。

答案 2 :(得分:0)

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

答案 3 :(得分:0)

当代的React应用程序并非总是使用PRIMARILY,功能组件以及在某些非常特殊的情况下(或旧代码)的类组件确实提供对生命周期方法(例如componentDidMount,componentDidUnmount等)的显式访问。我认为这些方法基本上可以替代其中一些生命周期方法,并且在95%的时间内就足够了。

钩子的缺点通常是依赖项数组,有时可能需要使用诸如useMemo之类的另一个钩子进一步提取值,然后可以对其进行静态检查,而不是在dep数组中使用表达式-实际上,这会发出警告。 >

但是最终,这实际上取决于您要实现的目标以及是否可以找到适合您的用例的正确钩子(很多时候是自定义钩子)。