尝试从 API 呈现数据时，githubData.map 不是函数

Question

我正在尝试使用 GithubAPI，并且我可以使用 Axios 和 componentDidMount 获取我想要的所有数据，但是由于某种原因，当我尝试使用地图进行渲染时，出现了这个烦人的错误我不知道为什么。

这是我的代码：

class SearchResult extends Component {
  constructor() {
    super();
    this.state = {
      githubData: []
    };
  }

  componentDidMount() {
    axios
      .get(`${api.baseUrl}/users/${this.props.location.state.userName}`)
      .then((res) => {
        console.log('res', res);
        this.setState({ githubData: res.data });
      });
  }

  render() {
    const { githubData } = this.state;
    return (
      <div className="search-result">
        {githubData.map((name, index) => (
          <p>{name.name}</p>
        ))}
      </div>
    );
  }
}

export default SearchResult;

Answer 1

GitHub 用户端点 returning 对象，因此 githubData 是对象而不是数组。在您的脚本中，您将其视为一个数组。 {}.map 会 return 一个错误

尝试从 API 呈现数据时，githubData.map 不是函数

githubData.map is not a function when trying to render data from API

github-api

reactjs