布局

能力

默认布局名：default
空白：export const layout = 'blank'
自定义：src/layouts/{name}.tsx

布局通过 children 渲染页面，不要自行使用 <Outlet />。

tsx

import type { ReactNode } from 'react';

/** 自定义管理布局。 */
export default function AdminLayout({ children }: { children?: ReactNode }) {
  return <div data-layout="admin">{children}</div>;
}

shell: false 且无 layouts/default.tsx 时使用框架精简默认壳。
shell: true 且无自定义 default 时使用 @selrux/shell 完整管理壳。

页面选择

tsx

/** 登录页不使用布局壳。 */
export const layout = 'blank';

export default function LoginPage() {
  return <main>登录</main>;
}

同布局页切换时布局实例保持挂载；切到 blank 或其它布局名时卸载。路由 id / useParams({ from }) 不受布局影响。

不支持

嵌套布局目录、布局级数据加载、复杂 layout 表达式（仅字符串字面量）。