---
url: /utils/hooks.md
---
# 组合式函数

与组件配套的组合式函数（Composables），均从包根导出。通用逻辑不再需要复制粘贴：

```js
import { useClipboard, useDarkMode, usePermission } from '@wil-works/evoke-business-ui'
```

## useClipboard — 剪贴板

`copy(text)` 返回 Promise，`copied` 为 300ms 复位成功标记，可直接驱动按钮反馈：

## useDarkMode — 暗色模式

读写 `html.dark`，全库令牌即时切换；配合 [主题定制](/guide/theming) 使用：

## useFullscreen — 全屏

控制整个页面或指定元素进入全屏。注意：进入全屏的元素**必须自带背景色**，否则会透出浏览器全屏态的黑底：

## usePermission — 权限判定

`has('user:delete')` / `hasAny([...])` / `hasAll([...])`；权限来源为 ConfigProvider 的 `permissions` 或 `setPermissions()` 全局码表：

## 全部清单

| 函数 | 返回 | 说明 |
| --- | --- | --- |
| useClipboard | `{ copied, copy }` | 剪贴板复制 |
| useDarkMode | `{ isDark, toggleDark, setDark }` | 暗色模式 |
| useFullscreen | `{ isFullscreen, enter, exit, toggle }` | 全屏控制 |
| usePermission | `{ permissions, has, hasAny, hasAll }` | 权限判定 |
| useTable | 表格状态与动作 | 分页/排序/筛选/加载，见 [企业级实践](/guide/enterprise) |
| useZIndex | `{ zIndex, next, current }` | 弹层层级递增 |
| useClickOutside | `(el, handler)` | 点击外部检测 |
| useFocusTrap | 焦点圈定 | Dialog/Drawer 内部使用 |
| useLockScroll | 锁定滚动 | 弹层打开时防滚动穿透 |
| useFloating | 定位引擎 | floating-ui 封装，Popper 家族基座 |
| useTeleport | 挂载点解析 | `to` 属性容错 |
| useSafeArea | `{ top, bottom, left, right }` | 全面屏安全区 insets（响应式），见 [移动端适配](/mobile/layout) |
| ensureViewportFit | 补写 meta | 页面 viewport 缺 `viewport-fit=cover` 时自动补上（缺失时 env() 恒为 0） |
| useFormItem | `{ form, formItem, size, disabled }` | 表单契约（输入类组件内部） |
| useConfigProvider | `{ size, locale, namespace, platform }` | 全局配置消费 |
| useLocale / usePlatform | 语言包 / 平台形态 | 国际化与移动端适配 |