Question

是的，我知道之前已经有人问过这个问题，但是实际上按照我的建议行不通。

因此，在运行render（）方法（在父级中）之前，我必须运行以下方法，因为我需要为Google图表和一些CheckBox准备大量数据。

正如您在下面看到的那样，它在名为parseTestData的函数中被调用：

this.setState({
    data: ...,
    levels: ...,
    ...
    ...
    },
});

我已经省略了很多信息，因为我实际上没有被允许分享这一部分。因此，我从父级构造函数中调用了函数parseTestData：

constructor(props) {
    super(props);
    this.parseTestData();
}

但是这样做告诉我：

无法在尚未安装的组件上调用setState。

环顾四周，建议似乎是改为这样做：

componentWillMount() {
    this.parseTestData();
}

但这实际上并没有设置状态。现在，所有依赖于父级状态的子级都将获得未定义的道具。

我该怎么办？

Answer 1

阅读您的文章，我认为您是React的新手。

每当状态发生变化时，React都会比较它维护的虚拟DOM和呈现的DOM，从而基本检查视觉变化。

如果在构造函数中调用方法，它将检测视觉变化并尝试渲染，因此每次构造函数都会被调用。

如果您正在将道具从父级传递到子级，并且已同意父级的状态，请确保您具有默认状态。

所以请问您的问题：

父母

constructor(props){
    super(props)
    this.state = // set your state but don't ever change state here
    .....
}

componentDidMount(){
    this.parseTestData(); // componentWillMount will also work fine
}

render(){
    return(
        <Child arg={this.state.someArg} />
    )
}

孩子

constructor(props){
    super(props)
    this.state = // set your state but don't ever change state here
    .....
}

anyFunction(){
    console.log(this.props.arg) // You can access your arguments here 
}

Answer 2

是的，您不能在构造函数中使用this.setState（）方法，而是可以直接为状态分配一个值。请参见下面的示例代码。

constructor(props)
{
  super(props);
  this.state = {
      data:'',
      levels: 2
    }
}

在渲染之前使用setState（）设置状态？

2 个答案: