尝试setState，但函数返回null

Question

我正在使用React与Spotify的Web API并尝试setState。我也在使用React的生命周期方法，但它一直返回null。

componentDidMount() {
  this.fetchNewReleases()
}

fetchNewReleases() {
  const options = {
    "items": {
       "album_type": "single"
     }
  }

  const items = spotifyWebApi.getNewReleases(options, function (err, data) {
    if (err) {
     console.log(err)
    }
    else {
      data.albums.items.filter(item => {
        return item.album_type = "single"
      })
    }
  })

  this.setState({
    items:items
  }) 
}

有谁能解释为什么请？

Answer 1

这是this problem的一个特例。当items被召唤时，setState不存在。异步getNewReleases调用不会返回结果，因为它还不存在。

它应该是：

  spotifyWebApi.getNewReleases(options, (err, data) => {
    if (err) {
     console.log(err)
    }
    else {
      this.setState({
        items: data.albums.items.filter(item => {
         return item.album_type === "single"
        })
      });
    }
  });

请注意，getNewReleases回调应该是箭头函数，以获得正确的this。

Answer 2

尝试：

componentDidMount() {
  this.fetchNewReleases()
}

 fetchNewReleases = () => {
          const options = {
            "items": {
              "album_type": "single"
            }
          }
          spotifyWebApi.getNewReleases(options, function (err, data) {
            if (err) {
              console.log(err)
            }
            else {
              let items = data.albums.items.filter(item => {
                return item.album_type = "single"
              })
              this.setState({
                items:items
              })
            }
          })

        }