Я слежу за книгой о разработке fullstack в Spring + React. Я новичок ie, и я следовал коду, указанному в книге, но я получаю сообщение об ошибке в названии. Я знаю, что это может иметь какое-то отношение к импорту, но я озадачен тем, где может быть проблема.
Приложение. js
import React from 'react';
import './App.css';
import AppBar from '@material-ui/core/AppBar';
import Toolbar from '@material-ui/core/Toolbar';
import Typography from '@material-ui/core/Typography';
import Carlist from './components/Carlist';
function App() {
return (
<div className="App">
<AppBar position="static" color="default">
<Toolbar>
<Typography variant="h6" color="inherit">
CarList
</Typography>
</Toolbar>
</AppBar>
<Carlist></Carlist>
</div>
);
}
export default App;
Carlist. js
import React, { Component } from 'react';
import {SERVER_URL} from '../constants.js'
import ReactTable from "react-table";
class Carlist extends Component {
constructor(props) {
super(props);
this.state = { cars: []};
}
componentDidMount() {
fetch(SERVER_URL + 'api/cars')
.then((response) => response.json())
.then((responseData) => {
this.setState({
cars: responseData._embedded.cars,
});
})
.catch(err => console.error(err));
}
render() {
const columns = [{
Header: 'Brand',
accessor: 'brand'
}, {
Header: 'Model',
accessor: 'model',
}, {
Header: 'Color',
accessor: 'color',
}, {
Header: 'Year',
accessor: 'year',
}, {
Header: 'Price €',
accessor: 'price',
},]
return (
<div className="App">
<ReactTable data={this.state.cars} columns={columns}
filterable={true}/>
</div>
);
}
}
export default Carlist;