我想从2个不同的网址同时向多个api发出get请求,然后我想用新属性“img”更新状态中的数组“items”,而不是覆盖它,我是寻找方法来追加它。我想保留第一个请求的属性。这是我的尝试。
componentDidMount(){
let url = ``;
let url2 = ``
fetch(url,{
method: 'GET'
})
.then((response)=> response.json())
.then((responseJson) => {
const newItems = responseJson.items.map(i => {
return{
itemId: i.itemId,
name: i.name,
};
})
const newState = Object.assign({}, this.state, {
items: newItems
});
console.log(newState);
this.setState(newState);
})
.catch((error) => {
console.log(error)
});
fetch(url2,{
method: 'GET'
})
.then((response)=> response.json())
.then((responseJson) => {
const newImg = responseJson.item.map( data=> {
return{
img: data.picture.url
};
})
const newState = Object.assign({}, this.state, {
items: newImg
});
console.log(newState);
this.setState(newState);
})
.catch((error) => {
console.log(error)
});
}
你可以使用Promise.all
方法更多信息here。例如:
const p1 = fetch(url,{
method: 'GET'
})
const p2 = fetch(url2,{
method: 'GET'
})
Promise.all([p1, p2]).then(values => {
// here you have an array of reponses
console.log(values);
})
使用EC6 Spread运算符
this.setState({items:{... this.state.items,newItems}});