[英]“TypeError: this.setState(…) is undefined” when making a promise after setting state
[英]Promise Returning Undefined When Setting State But Printing to Console Fine
所以我对 web 开发人员很陌生,但我正在尝试构建我的第一个前端应用程序,它只是从 API 获取一些数据并显示它。 当我console.log()
我的 promise 时,它返回一个对象数组,这是我想要的,也是我对 promise 的期望。 但是,当我尝试将组件的 state 设置为同一个承诺的数组时,React 会抛出这个错误:
Objects are not valid as a React child (found: [object Promise]). If you meant to render a collection of children, use an array instead.
以下是相关代码:
const config = {
method: 'get',
url: 'http://ergast.com/api/f1/2020/drivers.json',
headers: {}
};
export default class DriverList extends Component {
state = {
drivers: []
}
componentDidMount() {
axios(config)
.then(res => {
console.log(res.data.MRData.DriverTable.Drivers)
this.setState({
drivers: res.data.MRData.DriverTable.Drivers // *** Error pointing to this ***
});
console.log(this.drivers)
})
.catch(err => {
console.log(err)
});
}
render() {
return (
<div>
{this.state.drivers.map(driver =>
<Driver
firstName={driver.giveName}
lastName={driver.familyName}
driverID={driver.driverId}
/>)
}
</div>
)
}
}
对此的任何帮助将不胜感激!
我认为没有实际数据,而是Promise
。
试试这个怎么样??
componentDidMount() {
this.getDrivers();
}
getDrivers = async () => {
try {
const res = await axios(config);
const drivers = res.data.MRData.DriverTable.Drivers;
this.setState({
drivers
});
} catch (err) {
console.log(err);
}
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.