lbl-react-router v2.4.1

lbl-react-router

安装

npm install --save lbl-react-router
npm install --save react-router-dom history

使用

routes.tsx

import { RouteItem, useRoutes } from 'lbl-react-router'

const routes: Array<RouteItem> = [
  {
    path: '/',
    name: '根路径',
    redirect: '/home',
  },
  {
    path: '*',
    name: 'BaseLayout',
    element: <BaseLayout></BaseLayout>,
    children: [
      {
        path: '/home',
        name: '首页',
        element: <div>首页</div>,
        before: async () => {
          console.log('进入首页')
        },
      },
    ],
  },
  {
    path: '/login',
    name: '登录',
    element: <div>登录</div>,
  },
  {
    path: '*',
    name: '404',
    element: <div>页面不存在</div>,
  },
]

export const Routes = () => {
  return useRoutes(routes)
}

index.tsx

import React, { Component } from 'react'
import { ConfigRouter } from 'lbl-react-router'
import { Routes } from './routes'

function App() {
  return (
    <HashRouter>
      <ConfigRouter>
        <Routes></Routes>
      </ConfigRouter>
    </HashRouter>
  )
}

ReactDOM.render(<App />, document.getElementById('root'))

License

MIT © lblblong