我应该如何替换componentWillMount()？

Question

我正在使用React.js,如您所知,componentWillMount()将被弃用.我想替换我componentWillMount的.

我要把它的逻辑转移到constructor.在in componentWillMount和in中执行一些逻辑之间有什么区别constructor吗？

例如,

之前

class Hello extends React.Component {
    componentWillMount() {
      doSomething();
    }

  render() {
    return <div>{this.state.name} </div>
  }
}

后

class Hello extends React.Component {
    constructor(props) {
      super(props);

      doSomething();
    }

  render() {
    return <div>{this.state.name} </div>
  }
}

另外,当doSomething是setState时,构造函数和公共prop中是否有任何不同的设置状态？

在构造函数中

constructor(props) {
  super(props);

  this.state = { foo: 1 };
}

在公共道具

state = { foo: 1 };

Answer 1

constructor 不是执行某些操作的正确位置。因为它将完成其他操作。

componentDidMount 是正确的选择，因为它是一个异步函数，因此操作可以在后台运行，并且不会妨碍UI呈现。

您可以在以下列表中选择何时在 constructor 和之间使用componentDidMount：

建设者

做：

• 初始化状态
• 绑定事件处理程序

如果您不初始化状态并且不绑定方法，则无需实现构造函数。

别：

避免引入任何副作用或订阅。不要在构造函数中使用setState（）来设置状态。

componentDidMount

做：

• 需要DOM节点的初始化
• 从远程端点加载数据（在何处实例化网络请求）
• 设置任何订阅（不要忘记在componentWillUnmount（）中退订）

您可能也有兴趣阅读 react的创建者Dan Abramov 的评论：

我不想等待组件挂载以调度ajax调用来满足组件数据依赖性。我想尽快做到这一点，就像在构造函数中一样，甚至在componentWillMount中也是如此。

如果这是一个异步请求，则无论您在何处触发组件，该组件都无法在安装时完成。这是因为JS是单线程的，并且在我们仍在渲染时，网络请求无法“返回”并得到处理。因此，提前触发和延迟触发之间的差异通常可以忽略不计。

您说对了，尽管这种情况在极少数情况下很重要，但对于那些情况，建议不要这样做。但是您应该格外谨慎，因为状态可以在安装前进行更新，并且如果您的数据取决于状态，则在这种情况下可能必须重新提取。换句话说：如有疑问，请在componentDidMount中进行。

避免在构造函数和Will *生命周期中产生副作用的具体建议与我们正在进行的更改有关，以允许呈现异步和可中断的更改（部分是为了更好地支持此类用例）。我们仍在弄清楚它应该如何工作的确切语义，因此目前我们的建议更加保守。随着我们在生产中更多地使用异步渲染，我们将在不牺牲效率或正确性的情况下提供有关在何处触发请求的更具体的指导。但是就目前而言，为异步渲染提供一条清晰的迁移路径（从而在我们的建议中更加保守）更为重要。

为了获得更多兴趣，您也可以访问此帖子。