fix: fix unexpected 404 page rendering on first visit

Author: liuweiGL

src/router/components/Router/index.tsx

@@ -3,10 +3,11 @@ import { Freeze } from 'react-freeze'
 
 import { createBrowserHistory, createHashHistory, History } from 'history'
 
+import { WAITING_FIRST_MATCH } from '../../constants/global'
 import { LocationContext } from '../../context/LocationContext'
 import { NavigationContext } from '../../context/NavigationContext'
 import { RouteContext } from '../../context/RouteContext'
-import { ProHistory, ProInfo } from '../../core/history'
+import { ProHistory, ProInfo, ProSubscriber } from '../../core/history'
 import { MatchRecord, Route } from '../../core/route'
 import useCreation from '../../hooks/useCreation'
 import NotFound from '../NotFound'
@@ -15,6 +16,7 @@ export type ErrorInfo = {
   type: '404'
   error?: Error
 }
+
 export type ErrorHandler = (info: ErrorInfo) => ReactNode | void
 
 export type RouterProps = {
@@ -28,6 +30,11 @@ const renderRoutes = (records: MatchRecord[], handleError?: ErrorHandler) => {
   const { length } = records
 
   if (length < 1) {
+    // TODO: insert loading?
+    if (WAITING_FIRST_MATCH.value) {
+      return null
+    }
+
     return handleError?.({ type: '404' }) || <NotFound />
   }
 
@@ -57,6 +64,7 @@ export const Router = ({
     location: history.location,
     records: []
   })
+
   const proHistory = useCreation(
     {
       factory: () =>
@@ -66,6 +74,8 @@ export const Router = ({
     [basename, history, routes]
   )
 
+  console.log(records)
+
   const children = renderRoutes(records, onError)
 
   return (

src/router/constants/global.ts

@@ -0,0 +1,4 @@
+// 初始化阶段，还没开始匹配路由
+export const WAITING_FIRST_MATCH = {
+  value: true
+}

src/router/core/history.ts

@@ -1,5 +1,6 @@
 import { createPath, History, Location, parsePath, Path, To } from 'history'
 
+import { WAITING_FIRST_MATCH } from '../constants/global'
 import { isLazyComponent, loadLazyComponent } from '../utils/component'
 import { Noop } from '../utils/function'
 import {
@@ -163,6 +164,9 @@ export class ProHistory {
         return
       }
 
+      // 允许渲染 404 页面
+      WAITING_FIRST_MATCH.value = false
+
       const path = stripBasename(this.basename, pathname)
 
       if (!path) {