Question

constructor(props){
  super(props);

  this.state = {
      posts: [],
  }
}

componentWillMount() {
  fetch("https://newsapi.org/v2/top-headlines?country=us&apiKey=${API_KEY}")
      .then(res => res.json())
      .then(data => this.setState({posts:data}));
}

render() {
  return (
    <div>
      <ul>
        { this.state.posts.map(post => <li key={post.id}>{post.title}</li>) }
      </ul>
    </div>
  )
}

我正在尝试映射此新闻对象的标题，但是每当尝试执行此操作时，都会出现此错误：TypeError：this.state.posts.map不是函数。这是来自数据的对象的图片：https://i.imgur.com/ctvXXWA.png

Answer 1

使用Object.keys（）返回对象的数组

{Object.keys(posts).map((item, i) => (
       <li key={i}>{posts[item].title}</li>
))}

如何在对象上映射？

1 个答案: