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

Question

我正在尝试使用接收播放列表 ID 的 spotifywebapi.getPlaylist() 函数从 Spotify 显示 12 个播放列表。我可以单独调用它们，但是当我 componentDidMount 它们时，只有最后一个会呈现并显示在页面上。

我尝试将播放列表 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
            }
      })
    })
}

这是componentDidMount

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