vue-ahooks

• 安装： npm install vue-ahooks

1import {
2  useAwaitTo,
3  useDebounceFn,
4  useThrottleFn,
5  useMap,
6  useLockFn,
7  useToggle,
8  useTimeout,
9  useRafTimeout,
10  useDebounceWatch,
11} from "vue-ahooks";
12/**
13 * @ const [state, { set, toggle  }] = useToggle(defaultValue, reverseValue)
14 * @ state 当前状态
15 * @ toggle 根据defaultValue，reverseValue反转
16 */
17const [state, { set }] = useToggle();
18/**
19 * @ params requset(Promise)
20 * @ return err(异常 | null), data(Promise成功状态下数据)
21 */
22const [err, data] = await useAwaitTo(requset());
23
24/**
25 * @ params fn(需装饰函数)
26 * @ return run(执行函数)
27 */
28const run = await useLockFn(fn);
29
30/**
31 * @ params fn(需装饰函数), time(节流间隔)
32 * @ return run(已被装饰函数)
33 */
34const [run] = useThrottleFn(fn, time);
35
36/**
37 * @ params fn(需装饰函数), time(防抖间隔)
38 * @ return run(已被装饰函数)
39 */
40const [run] = useDebounceFn(fn, time);
41
42/**
43 * @ params initialValue?: 初始函数
44 * @ return type Actions<K, T> = {
45  set: (key: K, value: T) => void
46  get: (key: K) => T | undefined
47  remove: (key: K) => void
48  has: (key: K) => boolean
49  clear: () => void
50  setAll: (newMap: MapValue<K, T>) => void
51  reset: () => void
52}
53 */
54const [Map, Actions] = useMap(initialValue);
55
56/**
57 * @ params deps(依赖) effect(执行函数) options(同watch参数)
58 * @ return Null
59}
60 */
61useDebounceWatch(deps, effect, options);
62
63/**
64 * @ const clearTimeout = useRafTimeout(fn, delay)
65 * @ fn(待执行函数), delay(等待秒数,默认16)
66 * @ return clearTimeout
67 */
68useRafTimeout(() => {
69  fn();
70}, 1000);