React Router v6页面重载后路径参数消失问题求助

使用React Router v6时遇到异常：访问带路径参数的/project/:id路由时参数正常，但页面重载后参数消失，路由匹配到通配符的NotFound页面。

路由配置代码：

<Routes>
  <Route path="*" element={<NotFound />} />
  <Route path="/" element={<Landing />} />
  <Route
    path="/project/:id"
    element={
      <PrivateRoute>
        <SpecificProjectPage />
      </PrivateRoute>
    }
  />
</Routes>

已尝试的解决方法 #

• 安装最新版本的react-router
• 卸载react-router和react-router-dom后仅重装react-router-dom
  以上操作均未解决问题。

补充说明 #

PrivateRoute是未授权时重定向到首页的工具组件，代码如下：

const PrivateRoute = ({ children }) => {
  let { user } = useAuth();
  return user ? children : <Navigate to={'/'} />;
};

NotFound为匹配无对应路由的404页面，代码如下：

export default function NotFound() {
  return (
  <Flex
   direction="column">
    <Heading>
        404
      </Heading>
      <Text fontSize="18px" mt={3} mb={2}>
        Page Not Found
      </Text>
      <Text color={'gray.500'} mb={6}>
        The page you're looking for does not seem to exist
      </Text>

      <Button
        colorScheme={'cyan'}
        variant="solid"
        onClick={() => {
            window.location.href = '/';
        }}
      >
        Go to Home
      </Button>
  </Flex>
  );
}

内容的提问来源于stack exchange，提问作者beast_skas