组合式函数
与组件配套的组合式函数(Composables),均从包根导出。通用逻辑不再需要复制粘贴:
js
import { useClipboard, useDarkMode, usePermission } from '@wil-works/evoke-business-ui'useClipboard — 剪贴板
copy(text) 返回 Promise,copied 为 300ms 复位成功标记,可直接驱动按钮反馈:
useDarkMode — 暗色模式
读写 html.dark,全库令牌即时切换;配合 主题定制 使用:
useFullscreen — 全屏
控制整个页面或指定元素进入全屏。注意:进入全屏的元素必须自带背景色,否则会透出浏览器全屏态的黑底:
看板面板(点击按钮进入全屏演示)
usePermission — 权限判定
has('user:delete') / hasAny([...]) / hasAll([...]);权限来源为 ConfigProvider 的 permissions 或 setPermissions() 全局码表:
order:delete:无权限view+export:不满足
全部清单
| 函数 | 返回 | 说明 |
|---|---|---|
| useClipboard | { copied, copy } | 剪贴板复制 |
| useDarkMode | { isDark, toggleDark, setDark } | 暗色模式 |
| useFullscreen | { isFullscreen, enter, exit, toggle } | 全屏控制 |
| usePermission | { permissions, has, hasAny, hasAll } | 权限判定 |
| useTable | 表格状态与动作 | 分页/排序/筛选/加载,见 企业级实践 |
| useZIndex | { zIndex, next, current } | 弹层层级递增 |
| useClickOutside | (el, handler) | 点击外部检测 |
| useFocusTrap | 焦点圈定 | Dialog/Drawer 内部使用 |
| useLockScroll | 锁定滚动 | 弹层打开时防滚动穿透 |
| useFloating | 定位引擎 | floating-ui 封装,Popper 家族基座 |
| useTeleport | 挂载点解析 | to 属性容错 |
| useSafeArea | { top, bottom, left, right } | 全面屏安全区 insets(响应式),见 移动端适配 |
| ensureViewportFit | 补写 meta | 页面 viewport 缺 viewport-fit=cover 时自动补上(缺失时 env() 恒为 0) |
| useFormItem | { form, formItem, size, disabled } | 表单契约(输入类组件内部) |
| useConfigProvider | { size, locale, namespace, platform } | 全局配置消费 |
| useLocale / usePlatform | 语言包 / 平台形态 | 国际化与移动端适配 |