React - 组织路线 - 问题定向到新页面

Question

我希望我的 SignIn 组件在不渲染任何其他组件的情况下自行呈现。

我怎么能做到这一点。

下面是我的app.js

function App() {
  return (
    <>
    <div className="App">
      <BrowserRouter>
        <Navbar />
        <Stack direction="row" spacing={1} justifyContent="flex-start" style={{ backgroundColor: "#f0f4f8" }} sx={{ borderTopColor: '#d9e2ec', borderTopStyle: 'solid', borderTopWidth: '0.1em' }}>
          <Sidebar />
          <div className='pages'>
            <Routes>
              <Route path="/api/jobs/:id" element={<JobSelectOne />} />
              <Route path="/" element={<Home />} />
              <Route path="/create" element={<AddJob />} />
              <Route path="/profile" element={<Profile />} />
              <Route path="/signin" element={<SignIn />} />
            </Routes>
          </div>
        </Stack>
      </BrowserRouter>
    </div>
</>