从 componentDidMount() 访问对象

Question

我在componentDidMount()中调用了以下库，它成功返回了一个对象。

  componentDidMount() {
      var objData =call.MyLibStart('12121', this);
}

现在我需要在render()部分中使用objData。我还需要访问objData的某些属性，例如objData.

 render() {
//I need the object.postate here
}

如何访问那里的对象？在这里使用状态是个好主意吗？

Answer 1

您可以像@3Dos的答案一样访问该对象。如果要修改 objData 的值，请将其用作状态。如果您只想呈现该对象或获取值以检查某些内容，那么类属性就足够了。

确保以正确的方式获取对象：

componentWillMount () {
  this.objData = Object.assign({}, call.MyLibStart('12121', this))
  console.log('objData: ', this.objData) // inspect the object in debugger to check it's keys
}

componentDidMount的原因是它只在render函数之后运行。应用的流程如下所示：

1. 在 constructor() ： this.objData = null
2. 在render() ： this.objData = null
3. 在componentDidMount() ： this.objData = some object

此时，渲染函数不会更新，因为只有在您对状态进行了一些更改时，它才会更新。由于this.objData不是一个状态，所以它在render中将始终为空。因此，通过将componentDidMount更改为componentWillMount，objData在被调用时不会为空render。

Answer 2

你想要的可能是在构造函数中设置一个实例变量，以便你可以在其他类方法中访问它，例如 exemple ：

class MyComponent extends Component {
  constructor (props) {
    super(props)
    this.objData = call.MyLibStart('12121', this)
  }
  render () {
    // Do whatever you like with this.objData
    return null
  }
}

Answer 3

除非你需要访问挂载的组件，否则你可以在构造函数中将其设置为初始状态：

constructor(props) {
  super(props)
  this.state = {
    objData: call.MyLibStart('12121', this)
  }
}
render() {
  // use this.state.objData here
}