在 ReactJS 中从哪里发出初始 AJAX 请求答案

【问题标题】：Where to make an Initial AJAX request from in ReactJS在 ReactJS 中从哪里发出初始 AJAX 请求
【发布时间】：2014-07-01 01:14:10
【问题描述】：

我有一个页面需要加载一些初始 Ajax 数据。
我在此 Reactjs page 上读到我应该在 componentDidMount 中进行调用。

什么是从componentDidMount 而不是componentWillMount 发出请求的优势？

【问题讨论】：

【解决方案1】：

由于 react 旨在用作视图，因此您的 ajax 请求应该放置在您的模型中。

否则，如果由于某种原因您需要在视图中创建它，componentDidMount 和 componentWillMount 之间的区别在于第一个被调用一次元素被重新渲染并且您可以通过this.getDOMNode() 访问它，并且在render() 开始之前一次调用第二个。

【讨论】：

如果我不想弄乱节点怎么办。只是setState ?
当我们在第二种方法中手动渲染时，setState 会在第一种方法中自动为我们渲染。不是吗？
React 文档建议在 componentDidMount 中发送 ajax 请求：“如果您想与其他 JavaScript 框架集成，请使用 setTimeout 或 setInterval 设置计时器，或者发送 AJAX 请求，请在此方法中执行这些操作。 "
@myusuf componentWillMount 方法只被调用一次，而 componentDidMount 在每次重新渲染组件时都会被调用。因此，如果您想加载一些初始数据，您可以在componentWillMount 中进行。但是，如果您想在组件更改其状态时一次又一次地加载一些数据，您应该使用componentDidMount。
"每次重新渲染组件时都会调用componentDidMount。"

【解决方案2】：

在componentDidMount() 中，如果需要，您可以访问 DOM；在componentWillMount()，您还没有访问权限（尽管您可能不需要它，如果您只想致电setState）。

确保在您的render() 方法中，您能够优雅地呈现“空”状态（即在Ajax 结果返回之前）。 getInitialState() 在这里可以帮助设置一些基本的空状态。

【讨论】：

【解决方案3】：

当使用服务器渲染时，componentWillMount 被调用但componentDidMount 未被调用。因此，我倾向于在componentDidMount 中进行任何需要浏览器（包括 Ajax 和 DOM 操作）的初始化。

【讨论】：