Question

React的文档的

This页面显示应在componentDidMount事件中使用异步请求的数据，而getInitialState将状态对象初始化为默认的为空州。

有原因吗？也许getInitialState不会这样做或有不同的目的？是由于库的一些内部逻辑吗？

对版主和回答者的注意：这不是一个基于意见的问题：如果存在某种原因，那将是答案，但是，对我的问题的一个好的，正确的答案也可能是＃34;不，没有任何特殊原因，做任何你感觉更好的事情＆＃34;

Answer 1

getInitialState应该是道具的纯函数（尽管它们通常不被使用）。换句话说，使用相同的道具getInitialState应该返回相同的数据。

允许

componentDidMount具有动态行为，并导致副作用，例如dom操作和ajax请求（这是它的主要意图）。

处理此问题的常用方法是提前返回空div，加载消息<div>Loading</div>）或加载指示符（例如spinkit）。

在第一次渲染时，将显示微调器，然后最终使用数据更新状态，并且可以运行渲染的主要部分。

render: function(){
   // while loading
   if (!this.state.data){
     return <div className="spinner"></div>
   }

   // loaded, you can use this.state.data here
   return <div>...</div>
}

Answer 2

您不希望这样做，因为您的组件将等待异步请求，并且在完成之前无法装入。如果你有一些带有几个状态变量的html，请先让反应渲染而不是让它等待。我知道这是一个意见，但它也是一个关注点的分离。

为什么异步请求应该在componentDidMount中而不是在ReactJS中的getInitialState中进行？

2 个答案: