Maofeng
41 lines
1.6 KiB
Plaintext
41 lines
1.6 KiB
Plaintext
---
|
|
title: Configuration and effective layout
|
|
description: Manage controlled configuration, persistent preferences, and automatic region resolution.
|
|
order: 20
|
|
toc:
|
|
- id: controlled
|
|
title: Controlled and uncontrolled
|
|
- id: effective
|
|
title: Effective layout
|
|
- id: persistence
|
|
title: Persistence
|
|
---
|
|
|
|
## Controlled and uncontrolled {#controlled}
|
|
|
|
Without `layout`, `AppLayout` owns its state:
|
|
|
|
```tsx
|
|
<AppLayout defaultLayout={{ sidebarOpen: false }} sidebar={NavigationSidebar}>
|
|
<RouterOutlet />
|
|
</AppLayout>
|
|
```
|
|
|
|
After supplying `layout`, the caller must save each new snapshot from `onLayoutChange`:
|
|
|
|
```tsx
|
|
<AppLayout layout={layout} onLayoutChange={setLayout} aside={AssistantPanel}>
|
|
<RouterOutlet />
|
|
</AppLayout>
|
|
```
|
|
|
|
## Effective layout {#effective}
|
|
|
|
Configuration stores user intent, while the effective layout controls the current rendering. For example, `asideOpen` can remain `true` while a missing Aside slot or `asideEnabled: false` prevents the Aside from rendering. When `sidebarCollapsible` is `false`, the Sidebar remains visible even if the stored `sidebarOpen` value is `false`.
|
|
|
|
Header and Footer starts follow the same principle. `"sidebar"` only takes effect while both the Rail and Sidebar are visible; otherwise it moves inward to `"content"`.
|
|
|
|
## Persistence {#persistence}
|
|
|
|
The effective layout never writes back into configuration, so temporarily missing regions do not clear user preferences. An application can persist the complete `LayoutConfig` through `@workspace/preferences` in `onLayoutChange`, then supply it through `layout` when loading.
|