ReactJS componentDidMount、Fetch Spotify API、Promise

debugcn 投稿 Dev

user7904085

ReactJS、Spotify API、Promiseの使い方を学んでいます。Spotifyでミュージシャンのトップアルバムを取得して、トラックの30秒を再生しようとしています。

私はspotify-web-api-nodeと呼ばれるSpotifyパッケージを使用しています。ReactまたはJSについて基本的なことを理解していないと思います。Syntax error: Unexpected token, expected ( (11:8)

'react'からReactをインポートします。

import SpotifyWebApi from 'spotify-web-api-node';
require('dotenv').config();


export default class SpotifyComponent extends React.Component {
  // Create the api object with the credentials
  const spotifyApi = new SpotifyWebApi({
    clientId : process.env.REACT_APP_SPOTIFY_CLIENT_ID,
    clientSecret : process.env.REACT_APP_SPOTIFY_CLIENT_SECRET
  });
// Save the access token so that it's used in future calls
  componentDidMount() {
    **(11:8)** --> return spotifyApi = new Promise((resolve, reject) => {
      spotifyApi.clientCredentialsGrant()

      .then( => (data) {
        console.log('The access token expires in ' + data.body['expires_in']);
        console.log('The access token is ' + data.body['access_token']);
      });

      // using Promises through Promise, Q or when - get Elvis' albums in range [20...29]
      spotifyApi.getArtistAlbums('43ZHCT0cAZBISjO8DG9PnE', {limit: 10, offset: 20})
        .then(function(data) {
          console.log('Album information', data);
        }, function(err) {
          console.error(err);
        });
    });

    SpotifyWebApi.setPromiseImplementation(Q);
  }
}

オースティングレコ

constそのようなクラス内に定義を含めることはできません。

外に移動するか、const：を削除する必要があります。

// Create the api object with the credentials
const spotifyApi = new SpotifyWebApi({
  clientId : process.env.REACT_APP_SPOTIFY_CLIENT_ID,
  clientSecret : process.env.REACT_APP_SPOTIFY_CLIENT_SECRET
});

export default class SpotifyComponent extends React.Component {

または

export default class SpotifyComponent extends React.Component {
  // Create the api object with the credentials
  spotifyApi = new SpotifyWebApi({
    clientId : process.env.REACT_APP_SPOTIFY_CLIENT_ID,
    clientSecret : process.env.REACT_APP_SPOTIFY_CLIENT_SECRET
  });

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]