Javascript 在react Router中，我无法更改视图，但只有url在更改

请告诉我，当我点击导航链接时，url正在更改，但内容没有更改，这有什么问题 我正在尝试所有的方法，但无法解决问题，请看看这个

App.js

import React, { Component } from 'react';
import './App.css';
import {
  BrowserRouter as Router,
  Switch,
  Route
} from "react-router-dom";
import Home from './components/Home';
import About from './components/About';
import Nav from './components/Nav';
import Contact from './components/Contact';

class App extends Component {
  render(){
    return (
      <React.Fragment>
          <div id="page-wrapper">
          <Router>
            <Nav />
            <Switch>
              <Route path="/" exact component={Home} />
              <Route path="/about" exact component={About} />
              <Route path="/contact" exact component={Contact} />
              <Route ><Default /></Route>

            </Switch>
            <Footer />
          </Router>
          </div>
      </React.Fragment>
    );
  }
}

export default App;

import React，{Component}来自'React'；
导入“/App.css”；
进口{
BrowserRouter作为路由器，
转换
路线
}从“反应路由器dom”；
从“./components/Home”导入Home；
从“./components/About”导入关于；
从“./components/Nav”导入导航；
从“./components/Contact”导入联系人；
类应用程序扩展组件{
render（）{
返回(
);
}
}
导出默认应用程序；

我的链接文件，即导航栏

<Link to="/">
     <li className="nav-item">HOME</li>
 </Link>
 <Link to="/about">
     <li className="nav-item">About</li>
 </Link>

主页
关于

---

提前感谢

将您的

浏览器路由器

移动到

index.js

似乎在我这方面起到了作用

ReactDOM.render(
  <BrowserRouter>
    <App />
  </BrowserRouter>,
  document.getElementById("root")
);

ReactDOM.render(
,
document.getElementById（“根”）
);

---

然后从你的代码中删除

。

我只是复制/粘贴了你的代码（删除了一些不必要的东西），它工作得很好。是的，谢谢，我已经把BrowserRouter放在导航栏了，很高兴知道。这就是为什么我喜欢把它包起来，这样它“无处不在”。