在构造函数和 componentWillMount 中哪种初始化更合适？答案

【问题标题】：Which kinds of initialization is more appropriate in constructor vs componentWillMount?在构造函数和 componentWillMount 中哪种初始化更合适？
【发布时间】：2026-01-13 10:30:01
【问题描述】：

如果我有一个需要一些设置的 React 组件（例如，用于计时器或 WebAudio API 等），我将无法决定初始化是应该在 constructor 还是 componentWillMount 中进行。两者都有优点或缺点吗？我不清楚哪一个更适合这个。

我在 Google 上搜索了一下，看看是否有人讨论过 constructor 和 componentWillMount 之间的区别，但我找不到任何东西。

编辑：Redux 和任何异步函数都不应该是等式的一部分。

【问题讨论】：

根据文档，这应该在componentDidMount:facebook.github.io/react/docs/… "如果你想....设置计时器...或 setInterval...在此方法中执行这些操作。"

标签： reactjs

【解决方案1】：

通常，如果您的组件是有状态的，您在构造函数中唯一要做的就是分配您的初始 this.state。你不应该在构造函数中做任何其他事情。

componentWillMount 通常是不必要的。我会说在大多数情况下，它的使用是一种反模式。人们使用它的一个原因是在渲染之前最后一次从外部源更新状态，但技术上在构造函数中分配它是等效的。它提供的唯一便利是您可以在其中setState，但不能在构造函数中。

对于任何副作用（数据获取或 DOM 操作），您应该使用componentDidMount。

【讨论】：

看来如果我要构建一个高阶组件，我需要在componentWillMount 中进行设置。就像测试一样，我将WillMount 重命名为DidMount，我在包装的组件中收到一个关于不存在的道具的错误（这是从HOC 的状态传递给它的）。也许 HOC 是一种特殊情况，componentWillMount 是一个更好的初始化位置，并且必须根据一堆代码执行来设置状态？（具体指this code）
是否构建 HOC 没有区别。 HOC 只是一个返回组件的函数。该组件与任何其他组件没有什么不同，因此适用相同的规则。在您的代码中，您希望将用于计算初始状态的逻辑移动到您的构造函数中。您可以将其分配给this.state，而不是调用setState。
啊，所以构造函数是所有设置代码的合适位置。我不确定。无论它属于constructor 还是componentDidMount.. 因此，我一直在来回走动。 :) 所以，我明白了为什么 DOM 操作在构造函数中不起作用，但是数据获取有什么问题？
这是一个副作用。副作用不应放在构造函数中。没有理由说明这本身是“坏的”，但这是预期的使用模式。当构造函数运行时，并不能保证组件很快就会被挂载（实际上它会被挂载，但将来可能会改变）。所以请不要在构造函数中执行副作用。
另外，我不完全确定您所说的“所有设置代码”是什么意思。我在回答中说构造函数唯一适合的就是指定初始状态。这就是我建议进入构造函数的方法。我不建议将其他任何东西移到构造函数中。

【解决方案2】：

如果您想调用一些通量操作（用于 ajax 调用），请使用 componentWillMount 或 componentDidMount。

你可以在构造函数中初始化状态

【讨论】：