响应路由器链接不能跳转到页面

Question

我在我的项目中使用了react-router-dom .这是我的代码：

App.js

import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';

function App() {
  const currentUser = true;

  return (
    <Router>
      <Topbar />
      <Switch>
        <Route exact path="/">
          <Home />
        </Route>
        <Route path="/register">
          {currentUser ? <Home /> : <Register />}
        </Route>
        <Route path="/login">{currentUser ? <Home /> : <Login />}</Route>
        <Route path="/post/:id">
          <Single />
        </Route>
        <Route path="/write">{currentUser ? <Write /> : <Login />}</Route>
        <Route path="/settings">
          {currentUser ? <Settings /> : <Login />}
        </Route>
      </Switch>
    </Router>
  );
}

Topbar.jsx：

function Topbar() {
  const user = true;
  return (
    <div className="top">
        <div className="topLeft">
            <span className="topIcon iconfont icon-weixin"></span>
            <span className="topIcon iconfont icon-weibo"></span>
            <span className="topIcon iconfont icon-douyin"></span>
        </div>
        <div className="topCenter">
            <ul className="topList">
                <li className="topListItem"><Link className="link" to="/">HOME</Link></li>
                <li className="topListItem"><Link className="link" to="/">ABOUT</Link></li>
                <li className="topListItem"><Link className="link" to="/">CONTACT</Link></li>
                <li className="topListItem"><Link className="link" to="/write">WRITE</Link></li>
                <li className="topListItem">
                    { user && "LOGOUT" }
                </li>
            </ul>
        </div>
        <div className="topRight">
            {
                user ? (
                    <img className="topImg" src="https://assets.imgix.net/hp/snowshoe.jpg?auto=compress&w=900&h=600&fit=crop" alt="profile" />
                ) : (
                    <ul className="topList">
                        <li className="topListItem"><Link className="link" to="/login">LOGIN</Link></li>
                        <li className="topListItem"><Link className="link" to="/register">REGISTER</Link></li>
                    </ul>
                )
            }
            
            <span className="topSearchIcon iconfont icon-sousuo"></span>
        </div>
    </div>
  )
}

当我单击<Link />到<Write/>组件时，URL会更改，但页面不会更改.有人知道为什么吗？许多人谈到exact属性，但我已经在<Home/>组件中添加了这一点。

Answer 1

我找到了解决办法..。这是版本问题，我使用react18和反应性路由器-dom v5.而我把反应路由器变成v6，问题就解决了！