ナビゲーションとリダイレクトが反応ルーターのパスにリダイレクトされない

Question

ロジスティックタブがあります。logisticData 値が null の場合、ページを「:logisticId/edit」から「/logistic」にリダイレクトします。ただし、このコードを実行すると、コードはリダイレクトされません functionEditLogistic(){ const{state} =useLocation();constlogisticData=state;console.log(l

P粉352408038 · Answer

redirectユーティリティ関数は、データルーターのローダーおよび操作関数でのみ有効であり、React コンポーネントには影響しません。

useEffect フックの navigate 関数を使用して、命令的な ナビゲーション操作を発行できます。

import { useLocation, useNavigate } from 'react-router-dom'; 関数 EditLogistic() { const {状態} = useLocation(); const logisticData = 状態; const navigate = useNavigate(); useEffect(() => { if (!logisticData) { navigate("/logistic", { replace: true }); } }, [ロジスティックデータ、ナビゲート]); ... }

あるいは、

Navigate コンポーネントを介して 宣言的なナビゲーションアクションを発行することもできます。 import { Navigate, useLocation } from 'react-router-dom'; 関数 EditLogistic() { const {状態} = useLocation(); const logisticData = 状態; if (!logisticData) { 戻る＃＃＃; } ... }