useAppShellMobile
@astryxdesign/core v0.7.1 · useAppShellMobile
返回值
| 名称 | 类型 | 说明 |
|---|---|---|
isMobile | boolean | 当前视口是否小于 AppShell 移动端导航的断点。用它让挨着 AppShell 的移动端界面跟移动端导航踩同一个断点。 |
isMobileNavOpen | boolean | AppShell 管的那个移动端导航抽屉是否打开。 |
mobileNavId | string | undefined | 移动端导航抽屉的 DOM id,由 AppShell 设置。自定义按钮把它填进 aria-controls,读屏用户就知道这个按钮展开的是哪一块。不在管理抽屉的 AppShell 里时是 undefined。 |
toggleMobileNav | () => void | 切换 AppShell 管的移动端导航抽屉。移动端导航停用时不做任何事。 |
openMobileNav | () => void | 打开 AppShell 管的移动端导航抽屉。移动端导航停用时不做任何事。 |
closeMobileNav | () => void | 关闭 AppShell 管的移动端导航抽屉。 |
isMobileNavEnabled | boolean | 移动端导航是否已启用、并由 AppShell 管理。以下情况为 false:mobileNav 传了 false、没有导航内容、或者整个抽屉由自定义的 mobileNav 插槽负责。 |
hasAutoToggle | boolean | AppShell 的自动切换按钮是否启用。mobileNav.hasToggle 传 false 时为 false。自己画按钮之前,先和 isMobile、isMobileNavEnabled 一起判断。 |
hasSideNav | boolean | AppShell 有没有 sideNav 插槽。只有存在导航内容时才会托管移动端导航。 |
返回的对象是稳定的、响应式的。在模板或计算属性里读这些字段,视口变化时它们会跟着更新。