React App上的类型错误和算术运算错误

Question

https://github.com/tinntinnabulate78/jammming_mh

你好，我是新手。我对所有组件都进行了VSC的类型检查，并得到以下错误。我敢肯定有一个简单的解决方案，但是我已经多次重写了代码，并且有点恼火。我没看到什么？有任何想法吗？

//在Tracklist.js中

Type '{ children: Element[]; class: string; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.
  Property 'class' does not exist on type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.

//在Spotify.js中

The left-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type.
Type 'string' is not assignable to type 'Location'.

    // code for Spotify.js

let accessToken;
const clientID = '6d94a9a51b564b43b3e23189fe04307b';
const redirectURI = 'http://mhjammming.surge.sh/';

const Spotify = {
    getAccessToken() {
        if (accessToken)
          return accessToken;
          else if (window.location.href.match(/access_token=([^&]*)/) &&
        window.location.href.match(/expires_in=([^&]*)/))
        {
          let accessToken = window.location.href.match(/access_token=([^&]*)/)[1];
          let expiresIn = window.location.href.match(/expires_in=([^&]*)/)[1];
      
          window.setTimeout(() => accessToken = '', expiresIn*1000);
          window.history.pushState('Access Token', null, '/');
      
          return accessToken;
        }
        else
        {
          let url = `https://accounts.spotify.com/authorize?client_id=${clientID}&response_type=token&scope=playlist-modify-public&redirect_uri=${redirectURI}`;
          window.location = url;
        }
      },

  search(searchTerm) {
  return fetch(
    `https://api.spotify.com/v1/search?type=track&q=${searchTerm}`,
        {
          headers: {Authorization: `Bearer ${accessToken}`}
        }).then(response => {
          return response.json();     
           }).then(jsonResponse => {
           if (jsonResponse.tracks) {
               return jsonResponse.tracks.map(track => ({
                       id: track.id,
                       name: track.name,
                       artist: track.artists[0].name,
                       album: track.album.name,
                       uri: track.uri
                   }));
               }
       });

    },

  savePlaylist (playlistName, trackURIs) {
    if (playlistName && trackURIs.length) {
      let accessToken = Spotify.accessToken();
          const headers = {Authorization : `Bearer ${accessToken}`};
          let userID;
          let playlistID;
          return fetch(`https://api.spotify.com/v1/me`, {headers: headers}).then(response => {
            if (response.ok) {
            return response.json();
          }
          throw new Error ('Request failed!');
          }, networkError => {
            console.log(networkError.message);
          }).then(jsonResponse => {
            userID = jsonResponse.id;
            return fetch(`https://api.spotify.com/v1/users/${userID}/playlists`, {
              headers: headers,
              method : 'POST',
              body: JSON.stringify({name: playlistName})  
            }).then(response => {
                if (response.ok) {
                  return response.json();
                }
                throw new Error('Request failed!');
            }, networkError => {
              console.log(networkError.message)}).then(jsonResponse => {
                playlistID = jsonResponse.id;
                fetch(`https://api.spotify.com/v1/users/${userID}/playlists/${playlistID}/tracks`, {
                   headers : headers,
                   method: 'POST',
                   body: JSON.stringify({uris: trackURIs})
                }).then(response => {
                  if (response.ok) {
                  return response.json();
                }
                throw new Error('Request failed!');
              }, networkError => {
                console.log(networkError.message)}).then(jsonResponse => jsonResponse)
              });
              });
            }
          }
        }

export default Spotify```

// Tracklist.js的代码

import React from 'react';
import '../Tracklist/Tracklist.css';
import Track from '../Track/Track';

export class Tracklist extends React.Component {
    constructor(props) {
        super(props);
        this.state = { track: [] }
        }
    
    render() {
        return (
            <div>
                <div class="TrackList">
                {this.state.track.map((track) => (
                <Track onAdd={this.props.onAdd} key={track.id}
                onRemove={this.props.onRemove} isRemoval={this.props.isRemoval}/> 
                ))}
            </div>
            </div>
            )
        }
    }

export default Tracklist;