在React中呈现状态json

我无法让应用程序呈现这个简单的状态数据。在我看来，我无法获得渲染部分的信息来理解数据json

this.state.data应该包含该对象，因为我可以在该对象完成提取后对其进行console.log

我假设对象能够按原样渲染

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
var $ = require('jquery');

class App extends Component {

  loadData() {
    console.log("loading data");
        fetch('https://api.nytimes.com/svc/movies/v2/reviews/search.json?api-key=f90d8b6f90d04bb5bbbeb2f241155ce7&query=star wars')
            .then(response => response.json())
            .then(data => {
                this.setState({data: data });
        })
            .catch(err => console.error(this.props.url, err.toString()))
  }

  constructor(props) {
    super(props);
    this.state = { data: [] };
  }

  componentDidMount() {
    console.log('GrandChild did mount.');

      this.loadData()
  }
  render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">Welcome to React</h1>
        </header>
        <p className="App-intro">
          To get started, edit <code>src/App.js</code> and save to reload.
        </p>
        <ul>
                {this.state.data(function(name, index){
                    return <li key={ index }>{name}</li>;
                  })}
            </ul>
      </div>


    );
  }
}

export default App;

---

您有几个错误-请参阅代码中的修复和注释：

类应用程序扩展了React.Component{
loadData（）{
控制台日志（“加载数据”）；
取（'https://api.nytimes.com/svc/movies/v2/reviews/search.json?api-key=f90d8b6f90d04bb5bbebb2f24155ce7&query=starwars'）
.then（response=>response.json（））
。然后（数据=>{
this.setState（{data:data}）；
})
.catch（err=>console.error（this.props.url，err.toString（））
}
建造师（道具）{
超级（道具）；
this.state={data:null}；//使用null初始化
}
componentDidMount（）{
log（'孙子确实挂载了'）；
这是loadData（）
}
render（）{
const{data}=this.state；
返回(

//如果未加载数据，null将不呈现任何内容
//如果数据不为null，我们将使用map迭代data.results
{data&&data.results.map（函数（胶片、索引）{
//胶片是一个对象，只是要渲染的一个或多个属性
return
{film.headline}
；
})}

);
}
}
ReactDOM.render(
,
应用程序
);

小错误导致代码无法使用。谢谢修理。请注意，ReactDOM不起作用。它需要“导出默认应用程序”；正如您所看到的，我已经删除了与问题无关的所有内容。我无法在示例中使用import，因此我只渲染了组件。