Skip to content
On this page

Functions

Core
Add-ons
Sort by

State

对数据的状态更改捕捉(例如记录promise的等待以及成功状态,storage自动存取,一些双向的数据更改可以放这个分类)
useBoolean-优雅的管理 boolean 值
useCookie-操作 Cookie
useDelayData-对传入的布尔值镜像一个带有延迟的布尔值
useDynamicList-用于管理列表状态
useLocalStorage-管理 localStorage
useMap-优雅的管理 Map 结构数据
useSessionStorage-优雅操作 sessionStorage 存储
useSet-快捷操作 Set 数据结构
useToggle-用于在N个状态值间切换

Elements

元素(涉及到原生 DOM 的hook)
useDocumentHidden-获取页面是否隐藏
useFullscreen-控制元素全屏

Sensors

传感器(例如网络状态捕捉,网络资源加载,鼠标动向捕捉,scroll捕捉,屏幕区间捕捉)
useExternal-用于动态地向页面加载或卸载外部资源
useMediaQuery-监听 mediaQuery 状态 (此 hook 只针对单个监听,useMediaQueryS支持多个)
useMediaQueryS-存入预定的屏幕大小区间分类,监听 mediaQuery 状态,自动给出当前屏幕所在分类的key
useMousePosition-捕捉鼠标方位
useNetwork-获取当前网络状态
useScrollPosition-获取scroll 的Y轴滚动量 (可指定元素)
useTextSelection-获取用户选中的字符串以及其位置信息

Network

网络连接(例如http封装,websocket封装,fetch封装)
useWebSocket-管理 websocket

Component

组件hook,涉及到大量页面操作的hook
useVirtualList-管理虚拟列表

Time

时间(关于时间的处理)
useDate-操作时间,返回期望格式(内部使用了 dayjs)

Utilities

公共工具(例如转base64,转数字,eventBus,暂停sleep,防抖节流,这些)
useCopy-控制 剪切板内容
useDebounce-处理防抖值 - 连续触发只会更新一次值
useDebounceFn-处理防抖函数
useLockFn-给函数设置单行道,只有此函数执行完毕才能执行下一个
useQRCode-根据字符串生成二维码
useSleep-暂停程序 - 在设定时间后继续执行
useThrottle-处理节流值
useThrottleFn-处理节流函数
useTimeDown-便捷管理倒计时

@Router

vue-router的相关 hooks
useRouteQuery-获取vueRouter query (修改返回的state可直接修改url中的query)

@Component

组件库,除了导出组件还提供hook便于操作目标组件内部数据
button-按钮组件
dynamicLoading-全局动画 loading
tag-标签组件

@Utils

工具库,基础且单一的工具函数
deepCopy-深拷贝(兼容函数,对象,相互引用场景)
downloadFile-下载文件
getImageColor-获取图片中任意坐标的像素
getRandomStr-获取随机唯一字符串
precisionNumber-解决数字运算时精度问题(最高支持到16位)
promiseScheduler-promise 任务调度
splitNumRandom-根据给定的总数和位数得到固定位数的随机值的数组