使用 React JS 从 Spotify API 调用多个播放列表

Question

我正在尝试使用spotifywebapi.getPlaylist((函数显示来自Spotify的12个播放列表，该函数采用播放列表ID。我可以单独调用所有这些，但是当我组件DidMount它们时，只有最后一个会呈现并显示在页面上。

我尝试将播放列表 id 放入对象数组中并像这样调用它 spotifyWebApi.getPlaylist(${id}(但我收到"没有播放列表 id 输入"的错误

有谁知道如何一次显示/调用多个播放列表以使用 Spotify 在页面上呈现？

这是调用一个播放列表：

ariesPlaylist = () => {
spotifyWebApi.getPlaylist('37i9dQZF1DX2DC3Q7JOmYe')
.then((data) => {
console.log('updating')
console.log(data)
this.setState({
playlistData: {
name: data.name,
url: data.external_urls.spotify,
image: data.images[0].url
}
})
})
}

这是组件DidMount

componentDidMount() {
this.ariesPlaylist();
this.taurusPlaylist();
this.geminiPlaylist();
this.cancerPlaylist();
}

Answer 1

我认为在这种情况下，Promise.all((可能会对您有所帮助。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all