全栈的自我修养 ———— react router6默认二级路由配置？嵌套时候如何实现默认导航

在组件嵌套时候小编定义了一个共同组件于/public地址下，小编发现如果直接访问public是只有外部组件的页面，小编目标是访问public时候直接访问index页面，小编找了很多资料最终自己使出来了一个办法如下！！

• 小编自己发现的
• 后来查找到的

小编自己发现的

即把
      {
        path: '/public/index',
        element: (
          <Suspense fallback={<div>Loading...</div>}>
            <LazyIndex></LazyIndex>
          </Suspense>
        )
      },
    换成
      {
        path: '',
        element: (
          <Suspense fallback={<div>Loading...</div>}>
            <LazyIndex></LazyIndex>
          </Suspense>
        )
      },
      即可实现访问/public直接去我的path为空的地址！！

const router = createBrowserRouter([
  {
    path: '/',
    element: <Navigate to="/public/index" replace />,
    errorElement: <div>errorPage</div>,
  },
  {
    path: '/public',
    element: (
      <Suspense fallback={<div>Loading...</div>}>
        <LazyBaseComponents>
        </LazyBaseComponents>
      </Suspense>
    ),
    children: [
      {
        path: '',
        element: (
          <Suspense fallback={<div>Loading...</div>}>
            <LazyIndex></LazyIndex>
          </Suspense>
        )
      },
      {
        path: '/public/login',
        element: (
          <Suspense fallback={<div>Loading...</div>}>
            <LazyLogin></LazyLogin>
          </Suspense>
        )
      },
    ]
  }
]);

export default router;

后来查找到的

直接不写path，写一个index为true

      {
        index: true,
        element: (
          <Suspense fallback={<div>Loading...</div>}>
            <LazyIndex></LazyIndex>
          </Suspense>
        )
      },