<dd id="3pk9i"><optgroup id="3pk9i"><video id="3pk9i"></video></optgroup></dd>
<rp id="3pk9i"></rp>

<dd id="3pk9i"><track id="3pk9i"></track></dd>
      1. <th id="3pk9i"></th>
        1. <ol id="3pk9i"><ruby id="3pk9i"></ruby></ol>

        2. react-router-dom路由跳轉怎么實現-世界觀熱點

          來源:php中文網 | 2022-12-28 14:07:41 |


          (資料圖片)

          本教程操作環境:Windows10系統、react18.0.0版、Dell G3電腦。

          react-router-dom路由跳轉怎么實現?

          React-Router-dom路由跳轉

          useNavigate

          useNavigate方法可以手動操作進行路由跳轉,可以在不同頁面之間切換

          import { FunctionComponent } from "react";import { useNavigate } from "react-router-dom";import { Button } from "antd";export const Login: FunctionComponent = () => {  const navigate = useNavigate();  const login = () => {    navigate("/"); // 向 navigate 方法中傳入要跳轉的 path 路徑  };  return (    <div>      Login      <Button type="primary" onClick={login}>        登錄      </Button>    </div>  );};
          attribute描述
          replace路由歷史,當值為 true 時,不創建歷史條目
          state路由傳值,傳params參數

          在 CodeSandBox 上嘗試

          replace屬性默認值為false,使用{replace:true}這樣我們就不會創建登錄頁面歷史堆棧中的另一個條目。這意味著當他們到達受保護的頁面并單擊“上一步”按鈕時不會回到登錄頁面

          state屬性進行路由傳值,以params參數的形式傳遞,不會顯示在url后方,頁面刷新參數會丟失。在其他頁面我們是用 useLocation 方法獲取參數

          推薦學習:《react視頻教程》

          以上就是react-router-dom路由跳轉怎么實現的詳細內容,更多請關注php中文網其它相關文章!

          關鍵詞: React

          中文字幕在线观看2021
          <dd id="3pk9i"><optgroup id="3pk9i"><video id="3pk9i"></video></optgroup></dd>
          <rp id="3pk9i"></rp>

          <dd id="3pk9i"><track id="3pk9i"></track></dd>
            1. <th id="3pk9i"></th>
              1. <ol id="3pk9i"><ruby id="3pk9i"></ruby></ol>