我試圖在標志為真時顯示導航項,但問題是,當我嘗試從中獲取以下資料時,它回傳給我未定義,我為此創建了以下內容:
let navigate = useNavigate();
const userSignin = useSelector((state: RootStateOrAny) => state.userSignin);
const { userInfo } = userSignin;
const checkAdmin = useCallback(() => {
if (userInfo) {
if (typeof userInfo.user === "undefined") {
return null;
} else {
return userInfo.user.isAdmin;
}
} else {
return null;
}
}, []);
useEffect(() => {
checkAdmin();
if (!userInfo.user.isAdmin) {
navigate("/");
}
}, [checkAdmin]);
我做了 checkAdmin 函式,因為在此之前我有 userInfo.user.isAdmin 并且它回傳給我未定義。
{checkAdmin() && (
<NavbarItem
component='li'
onMouseEnter={() => setTopMenuIndex(4)}
onm ouseLeave={() => setTopMenuIndex(-1)}
>
<Box
style={{ whiteSpace: "nowrap" }}
component='a'
{...{ href: "/createItem" }}
>
{topMenuIndex === 4 && <Tippy topMenuIndex={topMenuIndex} />}
Admin Dashboard
</Box>
</NavbarItem>
)}
現在我想確保如果您沒有該標志,您將被重定向到主頁,但使用 userInfo.user.isAdmin 現在回傳 null。我怎樣才能更好地重新編碼這個邏輯,或者我怎樣才能至少讓這個 useEffect 正常作業。
uj5u.com熱心網友回復:
首先,您在陣列內的 useEffect 中傳遞 checkAdmin,但它是一個函式。據我所知,您只能通過狀態或道具來重繪 組件或重新渲染。
我不確定這個問題到底是什么,但據我說。
let navigate = useNavigate();
const userSignin = useSelector((state: RootStateOrAny) => state.userSignin);
const { userInfo } = userSignin;
// Old Node Version
const checkAdmin = () => {
if(userInfo) {
if(userInfo.user) {
return userInfo.user.isAdmin
}
};
return false;
};
// New Node Version
const checkAdmin = () => {
if(userInfo?.user?.isAdmin) {
return userInfo.user.isAdmin
};
return false;
};
useEffect(() => {
if (!checkAdmin()) {
navigate("/");
}
}, [userInfo]);
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/435179.html
標籤:javascript 反应 反应钩子
上一篇:添加動態鍵設定狀態,反應
