d76e8fb87f
* refactor: update umi version 3.x to version 4.x
* refactor: update react-router-dom version to 6.x
* refactor(react-router-dom): change Layout Component `props.children` to `<Outlet />`
* refactor(react-router-dom): change <Route /> props and <RouteSwitch /> correct
* refactor(react-router-dom): replace `<Redirect />` to `<Navigate replace />`
* refactor(react-router-dom): replace `useHistory` to `useNavigate`
* refactor(react-router-dom): replace `useRouteMatch` to `useParams`
* refactor(react-router-dom & dumi): fix <RouteSwitch /> & umi document bug
* refactor(react-router-dom): `useRoutes` Optimize `<RouteSwitch />` code
* refactor(react-router-dom): update `Route` types and docs
* refactor(react-router-dom): optimize RouteSwitch code
* refactor(react-router-dom): `useLocation` no generics type
* refactor(react-router-dom): add `less v3.9.0` to `resolutions` to solve the error of `gulp-less`
* refactor(react-router-dom): fix `<RouteSwitch />` `props.routes` as an array is not handled
* chore: upgrade `dumi` and refactor docs
* fix: completed code review, add `targets` to solve browser compatibility & removed `chainWebpack`
* refactor(dumi): upgraded dumi under `packages/core/client`
* refactor(dumi): delete `packages/core/dumi-theme-nocobase`
* refactor(dumi): degrade `react` & replace `dumi-theme-antd` to `dumi-theme-nocobase`
* refactor(dumi): solve conflicts between multiple dumi applications
* fix: login page error in react 17
* refactor(dumi): remove less resolutions
* refactor(dumi): umi add `msfu: true` config
* fix: merge bug
* fix: self code review
* fix: code reivew and test bug
* refactor: upgrade react to 18
* refactor: degrade react types to 17
* chore: fix ci error
* fix: support routerBase & fix workflow page params
* fix(doc): menu externel link
* fix: build error
* fix: delete
* fix: vitest error
* fix: react-router new code replace
* fix: vitest markdown error
* fix: title is none when refresh
* fix: merge error
* fix: sidebar width is wrong
* fix: useProps error
* fix: side-menu-width
* fix: menu selectId is wrong & useProps is string
* fix: menu selected first default & side menu hide when change
* fix: test error & v0.10 change log
* fix: new compnent doc modify
* fix: set umi `fastRefresh=false`
* refactor: application v2
* fix: improve code
* fix: bug
* fix: page = 0 error
* fix: workflow navigate error
* feat: plugin manager
* fix: afterAdd
* feat: update docs
* feat: update docs
* fix: page tab change not work
* fix: login redirect query param doesn't work
* fix: bug and doc
* feat: update docs
* fix: ci error
* fix: merge main
* feat: update docs
* feat: update docs
* feat: update docs
* chore(versions): 😊 publish v0.10.0-alpha.1
* fix: translations
* chore: backend node test max old space size
* docs: add useSearchParams
---------
Co-authored-by: chenos <chenlinxh@gmail.com>
Co-authored-by: ChengLei Shao <chareice@live.com>
75 lines
1.4 KiB
Markdown
75 lines
1.4 KiB
Markdown
# RouteSwitch
|
|
|
|
## `<RouteSwitchProvider />`
|
|
|
|
```ts
|
|
interface RouteSwitchProviderProps {
|
|
components?: ReactComponent;
|
|
routes?: RouteRedirectProps[];
|
|
}
|
|
```
|
|
|
|
## `<RouteSwitch />`
|
|
|
|
```ts
|
|
interface RouteSwitchProps {
|
|
routes?: RouteRedirectProps[];
|
|
components?: ReactComponent;
|
|
}
|
|
|
|
type RouteRedirectProps = RedirectProps | RouteProps;
|
|
|
|
interface RedirectProps {
|
|
type: 'redirect';
|
|
to: any;
|
|
path?: string;
|
|
push?: boolean;
|
|
from?: string;
|
|
[key: string]: any;
|
|
}
|
|
|
|
interface RouteProps {
|
|
type: 'route';
|
|
path?: string | string[];
|
|
sensitive?: boolean;
|
|
component?: any;
|
|
routes?: RouteProps[];
|
|
[key: string]: any;
|
|
}
|
|
```
|
|
|
|
## 完整示例
|
|
|
|
```tsx | pure
|
|
import React from 'react';
|
|
import { Link, MemoryRouter as Router } from 'react-router-dom';
|
|
import { RouteRedirectProps, RouteSwitchProvider, RouteSwitch } from '@nocobase/client';
|
|
|
|
const Home = () => <h1>Home</h1>;
|
|
const About = () => <h1>About</h1>;
|
|
|
|
const routes: RouteRedirectProps[] = [
|
|
{
|
|
type: 'route',
|
|
path: '/',
|
|
component: 'Home',
|
|
},
|
|
{
|
|
type: 'route',
|
|
path: '/about',
|
|
component: 'About',
|
|
},
|
|
];
|
|
|
|
export default () => {
|
|
return (
|
|
<RouteSwitchProvider components={{ Home, About }}>
|
|
<Router initialEntries={['/']}>
|
|
<Link to={'/'}>Home</Link>, <Link to={'/about'}>About</Link>
|
|
<RouteSwitch routes={routes} />
|
|
</Router>
|
|
</RouteSwitchProvider>
|
|
);
|
|
};
|
|
```
|