路由器被忽略[关闭]

Question

版本：

"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-router-dom": "^6.19.0",

代码：

export default function Board() {
    <BrowserRouter>
      <Routes>
        <Route exact path="/page/:param1/:param2"><Page/></Route>; 
      </Routes>
    </BrowserRouter>
   
  debugger;

  return (
    <>
    <div className="board-row">
      <Square />
      <Square />
      <Square />
    </div>
    <div className="board-row">
      <Square />
      <Square />
      <Square />
    </div>
    <div className="board-row">
      <Square />
      <Square />
      <Square />

    </div>
    </>
  );
}

另一种变体是：

    <Route exact path="/page/:param1/:param2" component={<Page/>}/>;

然后我去：http://localhost:3000/page/1/2

并停在上述调试器处。

我的期望是显示页面组件。但路线已被忽略。

该规则被忽略的原因可能是什么？我该如何解决该问题？

Answer 1

尝试这段代码，可能存在语法问题：-

export default function Board() {
  return (
    <BrowserRouter>
      <Routes>
        <Route path="/page/:param1/:param2" element={<Page />} />
      </Routes>
    </BrowserRouter>
  );
}