未捕获的TypeError:无法设置属性'_credentials'

时间:2017-05-19 18:09:27

标签: javascript node.js reactjs

我正在为一位音乐家工作。他想要Spotify上最受欢迎的9首歌曲。学习如何使用Spotify API和名为spotify-web-api-node的npm包。

因此,下面的代码假设在网站上生成9个音乐家最受欢迎的歌曲列表。

他收到的错误消息Uncaught TypeError: Cannot set property '_credentials' of undefined如果您可以提供一些有关做错的有用提示。

我的回购:https://github.com/brandonpowell/main-kdrusha-website

import React from 'react';
import SpotifyWebAPI from 'spotify-web-api-node';
require('dotenv').config();

export default class SpotifyComponent extends React.Component {
  constructor(props, context) {
    super(props, context);

    this.state = {
      SpotifyLoaded: false
    };
  }

  componentDidMount() {
    this.setState({
      SpotifyLoaded: true
    });
  }

  renderSpotify() {//date for spotify API GOES HERE
    if (!this.state.SpotifyLoaded) {
      const spotifyTemplate =
         `<a href="{link}" target="_blank" class="spotify__item">
              <img class="ablum_thumbnail_background" src="{albumImage.url} " />
          </a>`;
      const spotify = <SpotifyWebAPI
        getArtistAlbums={process.env.REACT_APP_SPOTIFY_ARTIST_ALBUMS}
        limit='9'
        offset='20'
        sortBy='most-popular'
        template={spotifyTemplate}
        customClass={this.state.SpotifyLoaded ? 'loaded' : ''}
        />;
      return spotify;
    };
  }

  render() {
    return (
      <section className="spotify-container">
         <div id='spotify'>{this.renderSpotify()}</div>
       </section>
    )
  };
}

1 个答案:

答案 0 :(得分:1)

错误与this未定义有关。您实际上使用的是构造函数函数,this指的是新创建的实例。我不太熟悉Spotify API,但您可能需要编写类似这样的内容:

var spotify = new SpotifyWebAPI({ /* yourcredentials */ });
var tracks = spotify.getArtistTopTracks(process.env.REACT_APP_SPOTIFY_ARTIST_ALBUMS)