好吧，我做错了什么，据我所知，我的路由器只有一个子元素 -
我的routes.js组件如下 -
import React from 'react'
import { BrowserRouter as Router, Route } from 'react-router-dom';
import MarketPlace from "./MarketPlace";
import Favourites from "./Favourites";
const routes = () => {
return (
<Router>
<div>
<Route exact path = "/" component = {MarketPlace}/>
<Route path = "/Favourites" component = {Favourites}/>
</div>
</Router>
)
}
export default routes
我的index.js就像这样 -
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import MarketPlace from './MarketPlace';
import registerServiceWorker from './registerServiceWorker';
import { render } from 'react-dom'
import routes from "./routes.js"
ReactDOM.render(routes(), document.getElementById('root'));
registerServiceWorker();
我使用的是最新版本的React Router，并且安装了React Router dom。
最佳答案
使用ReactDOM.render渲染路由时，将其渲染为React组件而不是函数调用。另外，为了渲染组件，JSX 标签需要以大写字符开头
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import MarketPlace from './MarketPlace';
import registerServiceWorker from './registerServiceWorker';
import { render } from 'react-dom'
import Routes from "./routes.js"
ReactDOM.render(<Routes/>, document.getElementById('root'));
registerServiceWorker();
关于javascript - 一个 <Router/> 只能有一个子元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50367065/