上手指南
Hooks 列表
后期规划
上手指南
Hooks 列表
后期规划
简体中文

useClipboardItems

Tags:
Browser
isSupported
DepCollect

几乎与 useClipboard 相同，但通过 ClipboardItem 支持多种丰富的内容。

演示

源码

用法

请查看 API。

源码

点击下方链接跳转 GitHub 查看源代码。

🪝 Hook🎨 Demo📄 Document

API

const clipboard = useClipboardItems(options)

选项 Options

export type UseClipboardItemsOptions<Source> = { /** * 启用剪贴板读取，需要请求权限 * * @defaultValue false */ read?: boolean /** * 拷贝源 */ source?: Source /** * 重置 `copied` 变量状态的毫秒数 * * @defaultValue 1500 */ copiedDuration?: number }

返回值

export type UseClipboardItemsReturns<Optional> = { /** * 浏览器是否支持剪贴板 API */ isSupported: boolean /** * 剪贴板内容 */ content: ClipboardItems /** * 内容已拷贝状态 */ copied: boolean /** * 拷贝内容到剪贴板 */ copy: Optional extends true ? (content?: ClipboardItems) => Promise<void> : (text: ClipboardItems) => Promise<void> /** * 清空剪贴板 */ clear(): void }