Question

我不断收到此错误： TypeError：散布不可迭代实例的无效尝试 当我试图在这里获取一些数据时：

export const genres = () => {
  const apiUrl = "http://localhost:3000/api";

  return fetch(apiUrl + "/genres")
    .then(response => response.json())
    .then(data => {
      const res = Array.from(data.results);
      return res;
    });   
};
console.log(genres)

export function getGenres() {
  return genres().then(res => res.filter(g => g));
}

并在此处更新组件的状态：

componentDidMount() {
    const genres = [{ _id: "", name: "All Genres" }, ...getGenres()];
    this.setState({ genres});

  }

我知道问题出在流派返回一个对象，而状态应该是一个数组的事实，但是我不确定如何解决这个问题。

谢谢

Answer 1

getGenres返回了一个承诺，因此您需要等待其解决后才能尝试将其返回的状态置于状态中。

componentDidMount() {
  getGenres().then(res => {
    const genres = [{ _id: "", name: "All Genres" }, ...res];
    this.setState({ genres });
  })
}

反应传播不可迭代实例的无效尝试

1 个答案: