this.state = {
data: [],
details: []
}
componentDidMount() {
this.getDetails()
this.getCountries()
}
getCountries() {
Utils.rest('POST', 'https:///api-spot-get-all', {
country: '',
windProbability: ''
}).then(async (r) => {
const data = await r.json();
this.setState({
data: data.result
})
}).catch(err => {
console.log(err.message);
});
}
`getDetails() {
return new Promise((resolve, reject) => {
let details_list = [];
this.state.data.map(item => {
return (
Utils.rest('POST', 'https:///api-spot-get-details', {
spotId: item.id
})
.then(async (r) => {
const details_item = await r.json()
console.log(`Loaded ${details_list.length} item ...(of ${this.state.data.length})`);
if (details_list.length === this.state.data.length) {
await resolve(details_list)
}
details_list.push(details_item.result);
})
);
})
})
}`
render() {
返回( { this.state.data.map((item, key) => { 返回 ( {项目.id} {项目.id} ); }) }
这是我的代码。第一次通话后,我收到 ID 并将其作为输入传递给第二次通话
最佳答案
我认为发生这种情况是因为您在 render
函数中调用 this.getCountries()
。因此,在每个渲染中都会调用该函数,这会导致设置新状态的新请求,这将触发新的渲染等等,从而创建无限循环。因此,如果您删除从 render
函数调用的函数,它应该可以工作。
关于javascript - getDetails() 中设置状态发生无限循环,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56235924/