来自React组件的REST调用

Question

我正在尝试使用不同的JSON 在此处复制相同的代码，但数据未加载。

请帮忙，我不确定代码中缺少什么。

 import React from 'react'; export default class ItemLister extends React.Component { constructor() { super(); this.state = { items: [] }; } componentDidMount() { fetch('http://media.astropublications.com.my/api/drebar_landing.json') .then(result=>result.json()) .then(items=>this.setState({items})); } render() { return( <ul> {this.state.items.length ? this.state.items.map(item=><li key={item.id}>{item.Title}</li>) : <li>Loading...</li> } </ul> ) } } 

Answer 1

您的api响应包含一个对象ArticleObject，而ArticleObject具有对象数组，因此您需要将items.ArticleObject设置为状态。

请看下面的解决方案以更好地了解

componentDidMount() {
  fetch('http://media.astropublications.com.my/api/drebar_landing.json')
      .then(result=>result.json())
      .then(items=>this.setState({items:items.ArticleObject}));
    }