React Router 未加载页面

Question

我正在学习在线 React 教程。在我下载 React Router（和 react-router-dom）时获得 React Router 4 时使用的教程 React Router 3。教程中的代码如下所示。

import React from "react";
import {render} from "react-dom";
import {Router, Route, browserHistory} from 'react-router'

import {Root} from "./components/Root";
import {Home} from "./components/Home";
import {User} from "./components/User";

class App extends React.Component {
    render() {
        return (
            <Router>
                <Route path={"user"} component={User}/>
                <Route path={"home"} component={Home}/>
            </Router>
        );
    }
}

render(<App />, window.document.getElementById('app'));

我正在尝试重写代码以像这样使用 React Router 4：

import React from "react";
import {render} from "react-dom";
import {Switch, BrowserRouter, Route} from 'react-router-dom'

import {Root} from "./components/Root";
import {Home} from "./components/Home";
import {User} from "./components/User";

class App extends React.Component {
    render() {
        return (
            <BrowserRouter>
                <Switch>
                    <Route path={"user"} component={User}/>
                    <Route path={"home"} component={Home}/>
                </Switch>
            </BrowserRouter>
        );
    }
}

render(<App />, window.document.getElementById('app'));

User.js 的代码如下所示：

import React from "react";

export class User extends React.Component {
    render() {
        return (
            <div>
                <h3>The User Page</h3>
                <p>User ID: </p>
            </div>
        );
    }
}

当我尝试 localhost:8080/user 它 returns 什么都没有。

我只得到

<div id="app">
    <!-- react-empty: 1 -->
</div>

我的代码需要更改什么？

Answer 1

试试

<Route path="/user" component={User}/>

React Router 未加载页面

React Router not loading page

reactjs

react-router

react-router-v4

react-router-dom