用函数

Question

我正在尝试使用函数回调在一个React组件中setState，这是现在推荐的方法。 它位于componentDidMount中，当我获取作业数据时，我需要更新状态。 当我直接设置它时，它可以正常工作，但我尝试过函数回调并且无法使其工作。 下面提供的示例代码是我多次尝试之一。

async componentDidMount(){
    const jobs = await loadJobs();
    this.setState({jobs});
    //this.setState((prevState, jobs) =>  {return {jobs: [prevState,...jobs]}})
}

正确的语法是什么？

Answer 1

当您想要根据prevState更新当前状态时，您只需要使用功能的setState，在您的情况下，您似乎只想设置状态作业，您只需编写

this.setState({jobs});

但是如果你想使用功能的setState，你仍然会写

  this.setState((prevState) =>  {
     return {jobs};
  })

您需要通过从prevState获取值并将结果附加到之前的状态来更新作业，您可以这样做

async componentDidMount(){

    const jobs = await loadJobs();
    this.setState((prevState) =>  {
       return {jobs: [...prevState.jobs, ...jobs]}
    })

}