您的JSON文件需要由服务器提供服务,因此您需要快速服务器(或任何其他服务器)。在这个例子中,我们使用 express 。
注意: 您也可以下载git repo
App.js文件
import React, { Component } from 'react';class App extends React.Component { constructor(props) { super(props); this.state = { data: null }; } componentDidMount() { const myHeaders = new Headers({ "Content-Type": "application/json", Accept: "application/json" }); fetch("http://localhost:5000/movie", { headers: myHeaders, }) .then(response => { console.log(response); return response.json(); }) .then(data => { console.log(data); this.setState({ data }); }); } render() { return <div className="App">{JSON.stringify(this.state.data)}</div>; }}export default App;server.js
var express = require("express");var data = require('./movie.json'); // your json file pathvar app = express();app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin", "*"); res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); next();});app.get("/movie", function(req, res, next) { res.send(data);});app.listen(5000, () => console.log('Example app listening on port 5000!'))


