Reactjs 州赢得'；我不能保持更新

在

getClients（）

中使用

setState

后，状态

clientOptions

正确显示。但当我试图将它传递给子组件时，它是一个空数组。我尝试在

componentDidMount

之后再次记录它，似乎状态

clientOptions

被重置为其原始状态（

[]

）。很抱歉，如果这看起来像是一个noob问题，我是非常新的反应

class Main extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      clientFilter: 'ALL',
      positionFilter: 'ALL',
      clientOptions: []
    };
  }

  componentDidMount = () => {
    this.getClients()
    this.getTitles()
    console.log('this one shows only []: ' + this.state.clientOptions)
  }
  
  getClients = () => {
    axios.get('http://localhost:5000/clients')
    .then((response) => {
      let clientObj = [{value: 'ALL', label: 'ALL'}];
      const clientOptions = []

      response.data.forEach(function (client, index) {
        clientObj.push({value: client.name, label: client.name})
      });
      clientOptions.push({'options' : clientObj});

      this.setState(prevState =>{
        return{
             ...prevState,
             clientOptions : clientOptions
        }
     })
     console.log('this one works: ' + this.state.clientOptions)
    });
  }

根据要求，该国将以下情况转告儿童：

  render() {
    return (
      <div className="main">
        <Header 
          clientOptions={this.state.clientOptions}
        />
      </div>
    );
  }

render（）{
返回(
);
}

您可以在将代码传递给子组件的位置发布代码吗无需在状态更新功能中添加

…prevState

。React会为您做这些。@SM1105922当然，请参阅添加的代码。

getClients（）

（可能还有

getTitles（）

）是异步的。在Ajax调用解决之前，您正在记录该值。它可以正常工作，您只需在Header组件中准备好当数据加载完成时道具将发生更改。或者从

clientOptions:null

开始，并在呈现方法的开始处放置类似

if（！this.state.clientOptions）{return load…；}

的内容。