我怎么解决这个问题？

Question

我使用了最近一次在终端上运行这段代码的version.Each，页面blank.What可能出错了，this.No控制台错误没有编译error.Just空白" React "；导入{ BrowserRouter作为路由器，路由，重定向，开关，}从“反应-路由器-多玛”；

   import About from "./Pages/About/About";
    import Contact from "./Pages/Contact/Contact";
    import Home from "./Pages/Home/Home";
    import Services from "./Pages/Home/Home";
    import Testimonial from "./Pages/Testimonial/Testimonial";
    import Navbar from "./Components/Navbar/Navbar";
    
    const App = () => {
      return (
        <Router>
          <Navbar />
          <main>
            <Switch>
              <Route path="/" exact>
                <Home />
              </Route>
              <Route path="/about" exact>
                <About />
              </Route>
              <Route path="/services" exact>
                <Services />
              </Route>
              <Route path="/testimonial" exact>
                <Testimonial />
              </Route>
              <Route path="/contact" exact>
                <Contact />
              </Route>
              <Redirect to="/" />
            </Switch>
          </main>
        </Router>
      );
    };
    
    export default App;

`

Answer 1

router现在正在使用版本6.他们已经将<Switch />组件重命名为<Routes /> .react路由器-V6-doc文档

这里是关于如何使用React路由器v6的一个简单示例

import React from 'react'
import ReactDOM from 'react-dom'
import { BrowserRouter as Router, Routes, Route} from 'react-router-dom'

import Home from './Home'
import About from './About'

ReactDOM.render(
    <Router>
        <Routes>
            <Route exact path="/" element={<Home />} />
            <Route exact path="/about" element={<About />} />
        </Routes>
    </Router>,
    document.getElementById('root')
)