CODEWITHSUNDEEP
javascriptnode.jsreactjs
user7904085
user7904085

Reputation:

Uncaught TypeError: Cannot set property '_credentials'

I'm working on a website for a musician. He wanted 9 of his most popular song that is on Spotify. Learning how to work with Spotify API and npm package called spotify-web-api-node.

So the code below supposes to generate 9 lists of the musician most popular songs on the website.

Error message that him getting Uncaught TypeError: Cannot set property '_credentials' of undefined If you could give some helpful tips on doing wrong.

My Repo: 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>
    )
  };
}

Upvotes: 0

Views: 939

Answers (1)

Chris
Chris

Reputation: 6182

The error is related to this being undefined. You're actually using a constructor function, and this refers to a newly created instance. I'm not too familiar with the Spotify API, but you'll probably need to write something like this:

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

Upvotes: 1

Related Questions