React Uncaught TypeError：search.map 不是函数

Question

我正在尝试使用维基百科 API。我正在使用 Axios 来请求数据。当我通过从 App 的 state 传递的 prop 去映射时，我收到以下错误：

Uncaught TypeError: search.map is not a function

我检查了预期的值是一个数组。看来，我可以在反应开发工具控制台中这样操作它。它还有一个 Array 的原型，所以我很困惑为什么我不能这样做。

根组件：

class App extends React.Component
{
  constructor()
  {
    super();
    this.state = {search: {}}
    this.wikiSearch();
  }
  wikiSearch()
  {
    axios
      .get('https://en.wikipedia.org/w/api.php?action=opensearch&search="test"')
      .then ((result) => {
        result.data.shift();
        this.setState({search: result.data});
      });
    }
  render ()
  {
    return(
    <div id="container">
      <Header />
      <SearchBar />
      <SearchList search={this.state.search} />
    </div>
    );
  }
}
export default App;

使用来自 App 的状态数据的组件

class SearchList extends React.Component
{
  render()
  {
    let search = this.props.search;
    search.map((element) => {

    });
    return(
      <div id='SearchList'>
      </div>
    );
  }
}

Answer 1

您需要在组件状态中将search 初始化为空数组变量，而不是对象，这样在调用map 方法时不会抛出错误，如下所示：

this.state = {search: []}

不是这样的：

this.state = {search: {}}