小编zam*_*meb的帖子

我在尝试进行简单的设置以运行时遇到问题。我使用了“react-router-dom”，因为它声称是周围记录最多的路由器。不幸的是，文档示例使用的是函数而不是类，我认为正在运行的示例不会解释路由是如何从以前的版本中改变的......你需要好好看看！顺便说一句，版本之间有很多重大变化。

我想要以下组件结构：

• 家
  • 登录
  • 登记
• 食谱
• 原料

具有以下组件：

index.js（工作正常）

import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter, Route } from 'react-router-dom';
import App from './App';

ReactDOM.render((
    <BrowserRouter>
        <Route component={App}/>
    </BrowserRouter>
), document.getElementById('root'));

App.js（很好）

import React from 'react';
import { Route, Switch } from 'react-router-dom';
import Home from './Home'
import Recipes from './recipes/Recipes'
import Ingredients from './ingredients/Ingredients'

class App extends React.Component {
    render() {
        return (
            <div id="App">
                <Switch>
                    <Route exact path='/home' component={Home} />
                    <Route path='/recipes' component={Recipes} /> …