Javascript 反应setState以更新对象

我有以下代码

axios
            .get("some.url")
            .then(res => {
                console.log(...res.data);
                this.setState({
                    isLoaded: true, 
                    assignmentData: {...res.data}
                });
                console.log(this.assignmentData) //this returns undefined
            })

它从后端获取一些数据并将其保存到状态变量。从服务器发送的数据采用以下格式

[{id:1，标题：“abc”}，{id:2，标题：“bcd”}]

。但是，

assignmentData

的值不会用setState更新，因为下面的

console.log

返回未定义的值

---

如何使用从服务器接收的数据更新

assignmentData

状态？

您试图访问与不存在的对象相关的值。它存在于

状态

。因此，您可以按如下方式访问：

this.state.assignmentData

要访问控制台日志中的值，请为setState提供回调，因为它是异步的：

this.setState({
  isLoaded: true,
  assignmentData: { ...res.data },
}, () => {
  console.log(this.state.assignmentData);
});

---

首先：

assignmentData

将添加到状态

this.state.assignmentData

其次，

这个.setState（…）

是异步的

如果要在设置数据后查看数据，可以执行以下操作：

this.setState({
  isLoaded: true, 
  assignmentData: {...res.data}
}, () => {
  console.log(this.state.assignmentData)
});

---

在setState的异步回调中记录日期，因为setState是异步的

axios
            .get("some.url")
            .then(res => {
                console.log(...res.data);
                this.setState({
                    isLoaded: true, 
                    assignmentData: {...res.data}
                },() => console.log(this.state.assignmentData)  );
            })

    axios
    .get("some.url")
    .then(res => {
        console.log(...res.data);
        this.setState({
            isLoaded: true, 
            assignmentData: {...res.data}
        },()=>console.log(this.state.assignmentData));
    })

---

控制台在setState的回调中，因为它是异步的

axios
            .get("some.url")
            .then(res => {
                console.log(...res.data);
                this.setState({
                    isLoaded: true, 
                    assignmentData: {...res.data}
                },() => console.log(this.state.assignmentData)  );
            })

    axios
    .get("some.url")
    .then(res => {
        console.log(...res.data);
        this.setState({
            isLoaded: true, 
            assignmentData: {...res.data}
        },()=>console.log(this.state.assignmentData));
    })

或者控制台内部的

render（）

您将获得更新状态。

试试这个

axios.get("some.url")
     .then(async(res) => {
       console.log(...res.data);
       await this.setState({
         isLoaded: true, 
         assignmentData: {...res.data}
       });
       console.log(this.assignmentData);
});

---

这对于特定的

控制台来说仍然是错误的。log

因为

setState

是异步的

此。分配数据将永远不会由此代码设置。它应该是
this.state.assignmentData
setState是一个异步函数