/**
* 项目入口 从这里开始运行
*/
import React from 'react';
import ReactDOM from 'react-dom/client';
import { ConfigProvider } from 'antd';
import zhCN from 'antd/es/locale/zh_CN';
import {RouterProvider} from 'react-router-dom'
import router from './router';
import store from './store'
import { Provider} from 'react-redux'
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
// 状态
<Provider store={store}>
{/* 组件 */}
<ConfigProvider locale={zhCN}>
{/* 路由 */}
<RouterProvider router={router}></RouterProvider>
</ConfigProvider>
</Provider>
);
router/index.js
import {createBrowserRouter} from 'react-router-dom'
import Home from '../page/Home';
import Login from '../page/Login';
import AuthRoute from "../components/AuthRoute"
const router = createBrowserRouter([
{ path: "/login", element: <Login /> },
{ path: "/home", element: <AuthRoute><Home /></AuthRoute>},
{ path: "/", element: <AuthRoute><Home /></AuthRoute>},
]);
export default router
AuthRoute 组件
import myUtil from "../../util"
import {Navigate} from 'react-router-dom'
/**
*
* @param { } Children 需要验证组件
* @returns
*/
function AuthRoute({children}){
const token = myUtil.getToken()
console.log(token)
if(token){
return (
<>
{children}
</>
)
}else{
return (<Navigate to={"/login"} replace />)
}
}
export default AuthRoute