Reactjs 如何避免React中复杂的初始状态声明

如果我在React render中使用复杂的对象结构，如何避免在getInitialState方法中重新定义该结构

var UserGist = React.createClass({
  getInitialState: function() {
    return {
      user:{
        section: {
          country: 'Iran'
        }
      },
      lastGistUrl: ''
    };
  },
....
....
  render: function() {
    return (
      <div>
        {this.state.user.section.country}'s Amex Initial
        <a href={this.state.lastGistUrl}>here</a>.
      </div>
    );
  }
});

---

而且该对象来自后端，因此如何避免在

getInitialState（）

中定义整个对象结构首先，状态应该是浅的。你不应该把深沉的物体当作道具或状态

接下来，你为什么要这么做？是不是这样在初始渲染时不会出现一堆“xx未定义”错误？如果是这样，为什么不在

getInitialState

中声明

user:{}

，并在渲染代码周围包装一个

If（！.isEmpty（this.state.user））

条件呢

或者，由于数据来自服务器，因此重新声明此结构可能是一件好事。您可以使用

getInitialState

创建占位符数据，直到真正的对象出现

另外，请注意

setState

只进行浅层替换。如果更改

user

对象的任何属性或子属性，则需要克隆它，更改属性，然后调用

setState（{user:clonedandUpdateUser}）

。或者，只需调用

forceUpdate

你真的应该试着让你的道具和状态变得肤浅

---

祝你好运

首先，为什么要在那里定义它？状态代表状态，而不是数据然后您也可以得到所有25个嵌套。然后，您仍然可以执行

this.state.user.section.country

。状态属性检查的存在性，在渲染内部有效。谢谢

user:{
 section: {
   .....
   25 levels of nesting
   .....{
         country: 'Iran'
        }
   }
}