首页 > 解决方案 > 使用 Spotify API 显示用户顶级艺术家

问题描述

let topArtists;

spotify.getMyTopArtists().then((artists) => {
   topArtists = artists.items;
   console.log(topArtists);
}, (err) => {
   console.log('Error:', err);
});

return (
   <div className="test">
      <h1>{}</h1>
   </div>
);

我目前能够在控制台中显示用户的顶级艺术家,如上面的代码所示,但是,我想知道我需要在返回中添加什么才能在实际网页上而不是在控制台中显示顶级艺术家.

标签: reactjsspotifyspotify-app

解决方案


使用 State 来保存值,然后您可以映射您的状态以显示。我已经包含了将艺术家添加到状态的代码。

import React { useState } from "react";

function App() {
 
  const [topArtists, setTopArtists] = useState([]);


  spotify.getMyTopArtists().then((artists) => {
     setTopArtists((prevEntries) => {
      return [artists.items, ...prevEntries];
    });
  }, (err) => {
    console.log('Error:', err);

};

推荐阅读