feat: 增加路由记忆功能

src/components/Navigation/index.tsx

@@ -1,3 +1,4 @@
+import { updateMatch } from '@/store/modules/navigation'
 import { checkPermission } from '@/store/modules/user'
 import { RootState } from '@/store/reducers'
 import { NavigationGuardsProps, RouteModol } from '@/types/router'
@@ -7,10 +8,11 @@ import { Redirect, Route } from "react-router-dom"
 import { AnyAction } from 'redux'
 
 const NavigationGuards:React.FC<NavigationGuardsProps> = props => {
-  const { location, routeConfig, match, check, permission, isLogin } = props
+  const { location, routeConfig, match, check, permission, isLogin, saveMatch } = props
   useEffect(() => {
     check()
   }, [])
+
   const parentPath: string | null = match?.path || null // 父路由的路径
   const targetPath: string | null  = location?.pathname || null// 目标路由的位置
   const targetRoute: RouteModol | null = targetPath && findTargetRoute(parentPath, targetPath, routeConfig) || null
@@ -30,6 +32,7 @@ const NavigationGuards:React.FC<NavigationGuardsProps> = props => {
   if (isLogin) {
     return <LoginHandler targetRoute={targetRoute}></LoginHandler>
   } else {
+    saveMatch(targetPath || '/')
     return <NotLoginHandler targetRoute={targetRoute}></NotLoginHandler>
   }
 }
@@ -92,16 +95,6 @@ function findTargetRoute (parentPath: any, targetPath: string, routeConfig: Rout
     const path = combinationPath(parentPath, item.path)
 
     if (targetPath && switchRoute(path, targetPath)) {
-      // if (targetPath !== path) {
-      //   const childRoutes: RouteModol[] = item.childRoutes.map(child => {
-      //     return { ...child, path: combinationPath(item.path, child.path) }
-      //   })
-      //   const routerIdx = childRoutes.findIndex(item => item.path === targetPath)
-
-      //   if (routerIdx !== -1) {
-      //     return childRoutes[routerIdx]
-      //   }
-      // }
       return { ...item, path }
     }
   }
@@ -143,7 +136,7 @@ function NotLoginHandler(props: any) {
 }
 
 const mapStateToProps = (state: RootState) => {
-  const { permission, isLogin } = state.user
+  const { user: { permission, isLogin } } = state
   return {
     permission,
     isLogin
@@ -152,10 +145,12 @@ const mapStateToProps = (state: RootState) => {
 
 const mapDispatchToProps = (dispatch: Dispatch<AnyAction>) => {
   return {
-      check: () => {
+      check() {
           dispatch(checkPermission())
+      },
+      saveMatch(path: string) {
+        dispatch(updateMatch(path))
       }
-
   }
 }
 const connector = connect(mapStateToProps, mapDispatchToProps)

src/store/modules/navigation/index.ts

@@ -1,3 +1,35 @@
-export const initState = {
+import { CLEAR_MATCH, iNavigationState, navigationActionTypes, UPDATE_MATCH } from "./types"
 
+// state
+export const initState:iNavigationState = {
+  match: '' // 目标路由
+}
+
+// reducer
+export function navigationReducer(state = initState, action: navigationActionTypes): iNavigationState {
+  switch (action.type) {
+    case UPDATE_MATCH:
+      return { ...state, match: action.payload }
+      break
+    case CLEAR_MATCH:
+      return initState
+      break
+    default:
+      return state
+      break
+  }
+}
+
+// action
+export function updateMatch(path: string): navigationActionTypes{
+  return {
+    type: UPDATE_MATCH,
+    payload: path
+  }
+}
+
+export function delMatch(): navigationActionTypes {
+  return {
+    type: CLEAR_MATCH
+  }
 }

src/store/modules/navigation/types.ts

@@ -0,0 +1,19 @@
+export interface iNavigationState {
+  match: string
+}
+
+// action
+
+export const UPDATE_MATCH = 'update_match'
+export const CLEAR_MATCH = 'clear_match'
+
+interface updateMatchAction {
+  type: typeof UPDATE_MATCH
+  payload: string
+}
+
+interface clearMatchAction {
+  type: typeof CLEAR_MATCH
+}
+
+export type navigationActionTypes = updateMatchAction | clearMatchAction

src/types/router.d.ts

@@ -32,6 +32,7 @@ interface NavigationGuardsProps extends RouteProps {
   permission: string | []
   isLogin: boolean
   check: () => void
+  saveMatch: (path: string) => void
 }
 export {
   RouteModol,