Javascript ReactJS-在状态中输入所有数据后，将我的加载更改为false

我想更改我的

状态。在状态中输入所有数据后，加载

为

false

我想创建一个web工作流，如下所示：

状态

创建时将

加载

条件设置为true

我想用

axios

获取3个JSON文件，并将它们保存到

状态

如果所有三个数据都已成功保存到

状态

，则将

状态更改。加载

为

假

但我得到的是

状态。在调用所有数据之前，加载

被声明为

false

代码如下所示：

constructor(props) {
    super(props);
    this.state = {
      jobs    : [],
      category: [],
      location: [],
      loading : true
    }
  }

  componentWillMount() {
    window.scrollTo(0, 0);
    //get any jobs available
    axios.get('/thisjob/all/all').then(({data}) => this.setState({
      jobs: [...data.jobs]
    }));
    //get any categories available
    axios.get('/thiscategory').then(({data}) => this.setState({
      category: [...data.category]
    }));
    //get any locations available
    axios.get('/thislocation').then(({data}) => this.setState({
      location: [...data.location]
    }));
    this.setState({
      loading: false
    })
  }

这是我在

console.log（）

我尝试了多种方法，从使用if语句到尝试将其保存到另一个生命周期方法，但结果仍然与我请求的工作流不同。
您可能希望使用异步等待方法或全部承诺。
所有问题解决后，您将状态设置为加载错误。
wait Promise.all（[someCall（），anotherCall（）]）
正如有人指出的，执行fetchincomponentdidmount并添加一个异步

async componentDidMount() {
    const res = await axios.get('/thisjob/all/all');
    const {ip} = await res.json(); // do other logic
    const res1 = await axios.get('/thiscategory');
    const {other} = await res1.json(); // do other logic
    const res2 = await axios.get('/thislocation');
    const {other2} = await res2.json(); // do other logic
    await this.setStateAsync({loading: false})
  }

您可能希望使用异步等待方法或promise all。
所有问题解决后，您将状态设置为加载错误。
wait Promise.all（[someCall（），anotherCall（）]）
正如有人指出的，执行fetchincomponentdidmount并添加一个异步

async componentDidMount() {
    const res = await axios.get('/thisjob/all/all');
    const {ip} = await res.json(); // do other logic
    const res1 = await axios.get('/thiscategory');
    const {other} = await res1.json(); // do other logic
    const res2 = await axios.get('/thislocation');
    const {other2} = await res2.json(); // do other logic
    await this.setStateAsync({loading: false})
  }

componentWillMount是错误的获取api数据的位置，使用ComponentDidmount我已经更新了它，但是仍然有相同的问题componentWillMount是错误的获取api数据的位置，使用ComponentDidmount我已经更新了它，但是仍然有相同的问题抱歉，您可能“想要”它现在工作。通过在我的方法中应用
async
和
await
，对不起，您可能“想要”它现在就可以工作了。通过在我的方法中应用
async
和
wait