optimize(packages): optimize code

soybeanjs · Sep 15, 2024 · 26f0579 · 26f0579
1 parent 0c6fba6
commit 26f0579
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 15 deletions.
diff --git a/packages/simple-router/src/Component.tsx b/packages/simple-router/src/Component.tsx
@@ -10,15 +10,13 @@ export type RouterProviderProps = {
 };
 
 const RouterProvider = ({ router, fallback }: RouterProviderProps) => {
-  const [route, setRoute] = useState(
-    router.resolve(router.reactRouter.state.location, undefined, router.reactRouter.state.matches.at(-1)?.params)
-  );
+  const [route, setRoute] = useState(router.resolve(router.reactRouter.state.location));
 
   useLayoutEffect(
     () =>
       router.reactRouter.subscribe(state => {
         if (state.navigation.state === 'idle') {
-          setRoute(router.resolve(state.location, undefined, state.matches.at(-1)?.params));
+          setRoute(router.resolve(state.location));
         }
       }),
     [router, setRoute]

diff --git a/packages/simple-router/src/matcher/index.ts b/packages/simple-router/src/matcher/index.ts
@@ -3,6 +3,7 @@ import type { Location } from 'react-router-dom';
 import { matchPath } from 'react-router-dom';
 import type { RouteLocationNamedRaw } from '../types';
 import { stringifyQuery } from '../query';
+import { transformLocationToFullPath } from '../utils/auxi';
 import type { RouteRecordRaw } from './types';
 import { createRouteRecordMatcher } from './pathMatcher';
 import {
@@ -145,27 +146,35 @@ class CreateRouterMatcher {
       name = matcher.record.name;
       params = cleanParams(location.params || {});
       fullPath = generatePath(matcher.record.path, params);
+
       query = location.query || {};
       const queryParams = stringifyQuery(query);
 
       fullPath += queryParams ? `?${queryParams}` : '';
+
       path = matcher.record.path;
+
+      if (location.hash) {
+        fullPath += location.hash;
+      }
     } else if (location.pathname) {
       // no need to resolve the path with the matcher as it was provided
       // this also allows the user to control the encoding
       path = location.pathname;
 
-      matcher = this.matchers.slice(1).find(m => {
-        return Boolean(matchPath(m.record.path, location.pathname));
-      });
+      matcher = this.matchers.slice(1).find(m => matchPath(m.record.path, location.pathname));
       if (!matcher) matcher = this.matchers[0];
 
       // matcher should have a value after the loop
       query = getQueryParams(location.search);
 
       if (matcher) {
+        const match = matchPath(matcher.record.path, location.pathname);
+        if (match?.params) {
+          params = match.params; // 如果有 params 则赋值
+        }
         name = matcher.record.name;
-        fullPath = location.pathname + location.search;
+        fullPath = transformLocationToFullPath(location);
       }
       // location is a relative path
     } else {

diff --git a/packages/simple-router/src/router.ts b/packages/simple-router/src/router.ts
@@ -1,5 +1,6 @@
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-nocheck
+
 import { createBrowserRouter, createHashRouter, createMemoryRouter } from 'react-router-dom';
 import type { Location, RouteObject } from 'react-router-dom';
 import type { ElegantConstRoute } from '@ohh-889/react-auto-route';
@@ -85,7 +86,7 @@ export function createRouter({ beforeEach, initRoutes, mode, opt, getReactRoutes
   }
 
   function onBeforeRouteChange({ nextLocation }: Parameters<BlockerFunction>[0]) {
-    const to = resolve(nextLocation, undefined, reactRouter.state.matches.at(-1)?.params);
+    const to = resolve(nextLocation);
 
     if (to.fullPath === currentRoute.fullPath) {
       return true;
@@ -150,7 +151,7 @@ export function createRouter({ beforeEach, initRoutes, mode, opt, getReactRoutes
     if (state.navigation.state === 'idle') {
       const from = currentRoute;
 
-      currentRoute = resolve(state.location, undefined, state.matches.at(-1)?.params);
+      currentRoute = resolve(state.location);
 
       afterEach(currentRoute, from);
     }
@@ -165,8 +166,7 @@ export function createRouter({ beforeEach, initRoutes, mode, opt, getReactRoutes
    */
   function resolve(
     rawLocation: Location | RouteLocationNamedRaw,
-    currentLocation?: RouteLocationNamedRaw,
-    params?: Record<string, any> | undefined
+    currentLocation?: RouteLocationNamedRaw
   ): RouteLocationNormalizedLoaded {
     const current = { ...(currentLocation as RouteLocationNamedRaw) };
 
@@ -186,9 +186,7 @@ export function createRouter({ beforeEach, initRoutes, mode, opt, getReactRoutes
     }
 
     const matchedRoute = matcher.resolve(matcherLocation, current);
-    if (params) {
-      matchedRoute.params = params;
-    }
+
     return {
       ...matchedRoute,
       redirectedFrom: currentRoute