React Router not loading page

Question

私はオンラインのリアクションチュートリアルに従っています。このチュートリアルでは、React Router 3をReact Router（とreact-router-dom）をダウンロードしたときに使用していました。チュートリアルのコードは次のようになります。私はで動作するようにコードを書き換えるしようとしている

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')); 

は次のようにルータ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> 
     ); 
    } 
} 

Iを試してくださいlocalhost:8080/user何も返しません。

私は、私は自分のコードに変更する必要が

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

それが何であるのですか？

Answer 1

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