@fluixi/路由器
框架-不可知路由器核心: URL → 一个已解决的匹配树 + 导航.
* 概览
@fluixi/router 路径 核心项目: 纯状态和a subscribe API,与 没有
反应, 没有 DOM, 没有视图框架。查看适配器(Fluixi适配器位于
@fluixi/core/router使匹配树 从上而下,这就
深层嵌入式布局/外出制作工程。 见 设计。 。 。 .
* 安装
pnpm add @fluixi/router
使用量
import { createRouter, createMemoryHistory } from '@fluixi/router';
const routes = [
{ path: '/app', component: AppLayout, children: [
{ path: '/app/home', component: HomePage },
{ path: '/app/user/:id', component: UserPage },
]},
];
const router = createRouter({ routes, history: createMemoryHistory('/app/home') });
router.state().match; // { matched: [AppLayout, HomePage], params, pathname }
router.subscribe((s) => render(s.match));
router.navigate('/app/user/42');
router.state().match.params; // { id: '42' }
• API
| 导出 | 什麽 |
|---|---|
matchRoutes(routes, pathname) | 纯匹配者 □ RouteMatch | null |
createRouter({ routes, history, base? }) | Router 与 state(), (中文(简体) ), subscribe(), (中文(简体) ), navigate(), (中文(简体) ), match(), (中文(简体) ), destroy() |
createMemoryHistory(initial?) 编号 : createBrowserHistory() | 可插入历史适配器 |
* 招标合同
match.matched 父亲 儿子 适配器从最深的小孩向上折叠,
将每个孩子传给父母,作为父母的出路:所有的具体价值,
从来没有推迟建造。 这种自上而下的组成 使得我们深陷其中 <Outlet/>
在任何深度进行工作.