我正在使用 NExtjS 和 react-redux 为管理面板创建登录页面和仪表板。下面是我尝试过的代码。如果我使用 ID 和密码登录,我可以登录并从状态中获取所有值,并且一切正常。问题是,如果我尝试直接访问仪表板 URL,它会说明
Cannot read properties of null (reading 'name')
如何将用户重定向到登录页面而不是起床返回语句 ???
import React, { useEffect } from 'react';
import { useSelector } from 'react-redux';
import { useRouter } from 'next/router';
import dynamic from 'next/dynamic';
const Dashboard = () => {
const { auth } = useSelector((state) => state);
const router = useRouter();
console.log(auth)
// I can get all the objects from state and cookies are set as state for browser reload so everything is fine here.
useEffect(() => {
if (!auth.userInfo && auth.userInfo.role == 'user') {
router.push('/admin');
console.log('I am here');
}
}, []);
return <h1>{auth.userInfo.name}</h1>;
};
export default dynamic(() => Promise.resolve(Dashboard), { ssr: false });