app.js

import React from 'react';import './App.css';
import  Home from './components/Home.js'
import World from "./components/World";
function App() {return (<div className="App">你好<World/></div>);
}export default App;

world.js

import React, {Component} from 'react';
import axios from 'axios'
class World extends Component {constructor(props) {super(props);this.state={arr:[]}}componentDidMount() {this.ajaxfun()}ajaxfun=()=>{axios.get("http://localhost:4000/arr").then((ok)=>{console.log(ok)this.setState({arr:ok.data})})}render() {return (<div>{this.state.arr.map((v, i) => {return <p key={i}>{v.name}</p>})}</div>);}
}export default World;

data.json

{"arr":[{"id":1,"name":"小明1"},{"id":2,"name":"小明2"},{"id":3,"name":"小明3"},{"id":4,"name":"小明4"}]
}

运行结果