ahooks

  • Version 3.10.0
  • Published
  • 623 kB
  • 8 dependencies
  • MIT license

Install

npm i ahooks
yarn add ahooks
pnpm add ahooks

Overview

react hooks library

Index

Variables

variable useDeepCompareEffect

const useDeepCompareEffect: any;

    variable useDeepCompareLayoutEffect

    const useDeepCompareLayoutEffect: any;

      variable useIsomorphicLayoutEffect

      const useIsomorphicLayoutEffect: any;

        variable useUpdateEffect

        const useUpdateEffect: any;

          variable useUpdateLayoutEffect

          const useUpdateLayoutEffect: any;

            Functions

            function clearCache

            clearCache: (key?: string | string[]) => void;

              function configResponsive

              configResponsive: (config: ResponsiveConfig) => void;

                function createUpdateEffect

                createUpdateEffect: (hook: EffectHookType) => EffectHookType;

                  function isCancelledError

                  isCancelledError: (error: unknown) => error is CancelledError;

                    function useAntdTable

                    useAntdTable: <TData extends Data, TParams extends Params>(
                    service: Service<TData, TParams>,
                    options?: AntdTableOptions<TData, TParams>
                    ) => AntdTableResult<TData, TParams>;

                      function useAsyncEffect

                      useAsyncEffect: (
                      effect: () => AsyncGenerator<void, void, void> | Promise<void> | (() => void),
                      deps?: DependencyList
                      ) => void;

                        function useBoolean

                        useBoolean: (defaultValue?: boolean) => [boolean, Actions];

                          function useClickAway

                          useClickAway: <T extends Event = Event>(
                          onClickAway: (event: T) => void,
                          target: BasicTarget | BasicTarget[],
                          eventName?: DocumentEventKey | DocumentEventKey[]
                          ) => void;

                            function useControllableValue

                            useControllableValue: {
                            <T = any>(props: StandardProps<T>): [T, (v: SetStateAction<T>) => void];
                            <T = any>(props?: Props, options?: Options<T>): [
                            T,
                            (v: SetStateAction<T>, ...args: any[]) => void
                            ];
                            };

                              function useCookieState

                              useCookieState: (
                              cookieKey: string,
                              options?: Options
                              ) => readonly [
                              string,
                              (
                              this: unknown,
                              newValue: string | ((prevState: State) => State),
                              newOptions?: CookieAttributes | undefined
                              ) => void
                              ];

                                function useCountDown

                                useCountDown: (options?: Options) => readonly [number, FormattedRes];

                                  function useCounter

                                  useCounter: (
                                  initialValue?: number,
                                  options?: Options
                                  ) => readonly [
                                  number,
                                  {
                                  readonly inc: (this: unknown, delta?: number | undefined) => void;
                                  readonly dec: (this: unknown, delta?: number | undefined) => void;
                                  readonly set: (this: unknown, value: ValueParam) => void;
                                  readonly reset: (this: unknown) => void;
                                  }
                                  ];

                                    function useCreation

                                    useCreation: <T>(factory: () => T, deps: DependencyList) => T;

                                      function useDebounce

                                      useDebounce: <T>(value: T, options?: DebounceOptions) => T;

                                        function useDebounceEffect

                                        useDebounceEffect: (
                                        effect: EffectCallback,
                                        deps?: DependencyList,
                                        options?: DebounceOptions
                                        ) => void;

                                          function useDebounceFn

                                          useDebounceFn: <T extends noop>(
                                          fn: T,
                                          options?: DebounceOptions
                                          ) => { run: any; cancel: () => void; flush: () => ReturnType<T> | undefined };

                                            function useDocumentVisibility

                                            useDocumentVisibility: () => VisibilityState;

                                              function useDrag

                                              useDrag: <T>(data: T, target: BasicTarget, options?: Options) => void;

                                                function useDrop

                                                useDrop: (target: BasicTarget, options?: Options) => void;

                                                  function useDynamicList

                                                  useDynamicList: <T>(initialList?: T[]) => {
                                                  list: T[];
                                                  insert: (index: number, item: T) => void;
                                                  merge: (index: number, items: T[]) => void;
                                                  replace: (index: number, item: T) => void;
                                                  remove: (index: number) => void;
                                                  batchRemove: (indexes: number[]) => void;
                                                  getKey: (index: number) => number;
                                                  getIndex: (key: number) => number;
                                                  move: (oldIndex: number, newIndex: number) => void;
                                                  push: (item: T) => void;
                                                  pop: () => void;
                                                  unshift: (item: T) => void;
                                                  shift: () => void;
                                                  sortList: (result: T[]) => T[];
                                                  resetList: (newList: T[]) => void;
                                                  };

                                                    function useEventEmitter

                                                    useEventEmitter: <T = void>() => EventEmitter<T>;

                                                      function useEventListener

                                                      useEventListener: {
                                                      <K extends keyof HTMLElementEventMap>(
                                                      eventName: K,
                                                      handler: (ev: HTMLElementEventMap[K]) => void,
                                                      options?: Options<HTMLElement>
                                                      ): void;
                                                      <K extends keyof ElementEventMap>(
                                                      eventName: K,
                                                      handler: (ev: ElementEventMap[K]) => void,
                                                      options?: Options<Element>
                                                      ): void;
                                                      <K extends keyof DocumentEventMap>(
                                                      eventName: K,
                                                      handler: (ev: DocumentEventMap[K]) => void,
                                                      options?: Options<Document>
                                                      ): void;
                                                      <K extends keyof WindowEventMap>(
                                                      eventName: K,
                                                      handler: (ev: WindowEventMap[K]) => void,
                                                      options?: Options<Window>
                                                      ): void;
                                                      (
                                                      eventName: string | string[],
                                                      handler: (event: Event) => void,
                                                      options?: Options<Window>
                                                      ): void;
                                                      (
                                                      eventName: string | string[],
                                                      handler: noop,
                                                      options: Options<TargetType>
                                                      ): void;
                                                      };

                                                        function useEventTarget

                                                        useEventTarget: <T, U = T>(
                                                        options?: Options<T, U>
                                                        ) => readonly [
                                                        T,
                                                        { readonly onChange: (e: EventTarget<U>) => void; readonly reset: () => void }
                                                        ];

                                                          function useExternal

                                                          useExternal: (path?: string, options?: Options) => Status;

                                                            function useFavicon

                                                            useFavicon: (href: string) => void;

                                                              function useFocusWithin

                                                              useFocusWithin: (target: BasicTarget, options?: Options) => boolean;

                                                                function useFullscreen

                                                                useFullscreen: (
                                                                target: BasicTarget,
                                                                options?: Options
                                                                ) => readonly [
                                                                boolean,
                                                                {
                                                                readonly enterFullscreen: (this: unknown) => void;
                                                                readonly exitFullscreen: (this: unknown) => void;
                                                                readonly toggleFullscreen: (this: unknown) => void;
                                                                readonly isEnabled: true;
                                                                }
                                                                ];

                                                                  function useFusionTable

                                                                  useFusionTable: <TData extends Data, TParams extends Params>(
                                                                  service: Service<TData, TParams>,
                                                                  options?: FusionTableOptions<TData, TParams>
                                                                  ) => FusionTableResult<TData, TParams>;

                                                                    function useGetState

                                                                    useGetState: {
                                                                    <S>(initialState: S | (() => S)): [
                                                                    S,
                                                                    Dispatch<SetStateAction<S>>,
                                                                    GetStateAction<S>
                                                                    ];
                                                                    <S = undefined>(): [S, Dispatch<SetStateAction<S>>, GetStateAction<S>];
                                                                    };

                                                                      function useHistoryTravel

                                                                      useHistoryTravel: <T>(
                                                                      initialValue?: T,
                                                                      maxLength?: number
                                                                      ) => {
                                                                      value: T | undefined;
                                                                      backLength: number;
                                                                      forwardLength: number;
                                                                      setValue: (this: unknown, val: T) => void;
                                                                      go: (this: unknown, step: number) => void;
                                                                      back: (this: unknown) => void;
                                                                      forward: (this: unknown) => void;
                                                                      reset: (this: unknown, ...args: any[]) => void;
                                                                      };

                                                                        function useHover

                                                                        useHover: (target: BasicTarget, options?: Options) => boolean;

                                                                          function useInfiniteScroll

                                                                          useInfiniteScroll: <TData extends Data>(
                                                                          service: Service<TData>,
                                                                          options?: InfiniteScrollOptions<TData>
                                                                          ) => {
                                                                          data: TData;
                                                                          loading: boolean;
                                                                          error: Error | undefined;
                                                                          loadingMore: boolean;
                                                                          noMore: boolean;
                                                                          loadMore: (this: unknown) => void;
                                                                          loadMoreAsync: (this: unknown) => Promise<TData>;
                                                                          reload: (this: unknown) => void;
                                                                          reloadAsync: (this: unknown) => Promise<TData>;
                                                                          mutate: any;
                                                                          cancel: () => void;
                                                                          };

                                                                            function useInterval

                                                                            useInterval: (
                                                                            fn: () => void,
                                                                            delay?: number,
                                                                            options?: { immediate?: boolean }
                                                                            ) => () => void;

                                                                              function useInViewport

                                                                              useInViewport: (
                                                                              target: BasicTarget | BasicTarget[],
                                                                              options?: Options
                                                                              ) => readonly [boolean | undefined, number | undefined];

                                                                                function useKeyPress

                                                                                useKeyPress: (
                                                                                keyFilter: KeyFilter,
                                                                                eventHandler: (event: KeyboardEvent, key: KeyType) => void,
                                                                                option?: Options
                                                                                ) => void;

                                                                                  function useLatest

                                                                                  useLatest: <T>(value: T) => MutableRefObject<T>;

                                                                                    function useLocalStorageState

                                                                                    useLocalStorageState: <T>(
                                                                                    key: string,
                                                                                    options?: Options<T>
                                                                                    ) => readonly [T, (this: unknown, value: SetState<T>) => void];

                                                                                      function useLockFn

                                                                                      useLockFn: <P extends any[] = any[], V = any>(
                                                                                      fn: (...args: P) => Promise<V>
                                                                                      ) => (...args: P) => Promise<V | undefined>;

                                                                                        function useLongPress

                                                                                        useLongPress: (
                                                                                        onLongPress: (event: EventType) => void,
                                                                                        target: BasicTarget,
                                                                                        { delay, moveThreshold, onClick, onLongPressEnd }?: Options
                                                                                        ) => void;

                                                                                          function useMap

                                                                                          useMap: <K, T>(
                                                                                          initialValue?: Iterable<readonly [K, T]>
                                                                                          ) => readonly [
                                                                                          Map<K, T>,
                                                                                          {
                                                                                          readonly set: (this: unknown, key: K, entry: T) => void;
                                                                                          readonly setAll: (this: unknown, newMap: Iterable<readonly [K, T]>) => void;
                                                                                          readonly remove: (this: unknown, key: K) => void;
                                                                                          readonly reset: (this: unknown) => void;
                                                                                          readonly get: (this: unknown, key: K) => T | undefined;
                                                                                          }
                                                                                          ];

                                                                                            function useMemoizedFn

                                                                                            useMemoizedFn: <T extends noop>(fn: T) => PickFunction<T>;

                                                                                              function useMount

                                                                                              useMount: (fn: MountCallback) => void;

                                                                                                function useMouse

                                                                                                useMouse: (target?: BasicTarget) => CursorState;

                                                                                                  function useMutationObserver

                                                                                                  useMutationObserver: (
                                                                                                  callback: MutationCallback,
                                                                                                  target: BasicTarget,
                                                                                                  options?: MutationObserverInit
                                                                                                  ) => void;

                                                                                                    function useNetwork

                                                                                                    useNetwork: () => NetworkState;

                                                                                                      function usePagination

                                                                                                      usePagination: <TData extends Data, TParams extends Params>(
                                                                                                      service: Service<TData, TParams>,
                                                                                                      options?: PaginationOptions<TData, TParams>
                                                                                                      ) => PaginationResult<TData, TParams>;

                                                                                                        function usePrevious

                                                                                                        usePrevious: <T>(state: T, shouldUpdate?: ShouldUpdateFunc<T>) => T | undefined;

                                                                                                          function useRafInterval

                                                                                                          useRafInterval: (
                                                                                                          fn: () => void,
                                                                                                          delay: number | undefined,
                                                                                                          options?: { immediate?: boolean }
                                                                                                          ) => () => void;

                                                                                                            function useRafState

                                                                                                            useRafState: {
                                                                                                            <S>(initialState: S | (() => S)): [S, Dispatch<SetStateAction<S>>];
                                                                                                            <S = undefined>(): [S, Dispatch<SetStateAction<S>>];
                                                                                                            };

                                                                                                              function useRafTimeout

                                                                                                              useRafTimeout: (fn: () => void, delay: number | undefined) => () => void;

                                                                                                                function useReactive

                                                                                                                useReactive: <S extends Record<string, any>>(initialState: S) => S;

                                                                                                                  function useRequest

                                                                                                                  useRequest: {
                                                                                                                  <TService extends AnyService>(
                                                                                                                  service: TService,
                                                                                                                  options?: Options<InferData<TService>, InferParams<TService>>,
                                                                                                                  plugins?: Plugin<InferData<TService>, InferParams<TService>>[]
                                                                                                                  ): Result<InferData<TService>, InferParams<TService>>;
                                                                                                                  <TData, TParams extends any[]>(
                                                                                                                  service: Service<TData, TParams>,
                                                                                                                  options?: Options<TData, TParams>,
                                                                                                                  plugins?: Plugin<TData, TParams>[]
                                                                                                                  ): Result<TData, TParams>;
                                                                                                                  };

                                                                                                                    function useResetState

                                                                                                                    useResetState: <S>(
                                                                                                                    initialState: S | (() => S)
                                                                                                                    ) => [S, Dispatch<SetStateAction<S>>, ResetState];

                                                                                                                      function useResponsive

                                                                                                                      useResponsive: () => ResponsiveInfo;

                                                                                                                        function useSafeState

                                                                                                                        useSafeState: {
                                                                                                                        <S>(initialState: S | (() => S)): [S, Dispatch<SetStateAction<S>>];
                                                                                                                        <S = undefined>(): [S, Dispatch<SetStateAction<S>>];
                                                                                                                        };

                                                                                                                          function useScroll

                                                                                                                          useScroll: (
                                                                                                                          target?: Target,
                                                                                                                          shouldUpdate?: ScrollListenController
                                                                                                                          ) => Position | undefined;

                                                                                                                            function useSelections

                                                                                                                            useSelections: <T>(
                                                                                                                            items: T[],
                                                                                                                            options?: T[] | Options<T>
                                                                                                                            ) => {
                                                                                                                            readonly selected: T[];
                                                                                                                            readonly noneSelected: boolean;
                                                                                                                            readonly allSelected: boolean;
                                                                                                                            readonly partiallySelected: boolean;
                                                                                                                            readonly setSelected: any;
                                                                                                                            readonly isSelected: (item: T) => boolean;
                                                                                                                            readonly select: (this: unknown, item: T) => void;
                                                                                                                            readonly unSelect: (this: unknown, item: T) => void;
                                                                                                                            readonly toggle: (this: unknown, item: T) => void;
                                                                                                                            readonly selectAll: (this: unknown) => void;
                                                                                                                            readonly unSelectAll: (this: unknown) => void;
                                                                                                                            readonly clearAll: (this: unknown) => void;
                                                                                                                            readonly toggleAll: (this: unknown) => void;
                                                                                                                            };

                                                                                                                              function useSessionStorageState

                                                                                                                              useSessionStorageState: <T>(
                                                                                                                              key: string,
                                                                                                                              options?: Options<T>
                                                                                                                              ) => readonly [T, (this: unknown, value: SetState<T>) => void];

                                                                                                                                function useSet

                                                                                                                                useSet: <K>(
                                                                                                                                initialValue?: Iterable<K>
                                                                                                                                ) => readonly [
                                                                                                                                Set<K>,
                                                                                                                                {
                                                                                                                                readonly add: (this: unknown, key: K) => void;
                                                                                                                                readonly remove: (this: unknown, key: K) => void;
                                                                                                                                readonly reset: (this: unknown) => void;
                                                                                                                                }
                                                                                                                                ];

                                                                                                                                  function useSetState

                                                                                                                                  useSetState: {
                                                                                                                                  <S extends Record<string, any>>(initialState?: undefined): [
                                                                                                                                  Partial<S>,
                                                                                                                                  SetState<Partial<S>>
                                                                                                                                  ];
                                                                                                                                  <S extends Record<string, any>>(initialState: S | (() => S)): [S, SetState<S>];
                                                                                                                                  };

                                                                                                                                    function useSize

                                                                                                                                    useSize: (target: BasicTarget) => Size | undefined;

                                                                                                                                      function useTextSelection

                                                                                                                                      useTextSelection: (target?: BasicTarget<Document | Element>) => State;

                                                                                                                                        function useTheme

                                                                                                                                        useTheme: (options?: Options) => {
                                                                                                                                        theme: ThemeType;
                                                                                                                                        themeMode: 'dark' | 'light' | 'system';
                                                                                                                                        setThemeMode: (this: unknown, mode: 'dark' | 'light' | 'system') => void;
                                                                                                                                        };

                                                                                                                                          function useThrottle

                                                                                                                                          useThrottle: <T>(value: T, options?: ThrottleOptions) => T;

                                                                                                                                            function useThrottleEffect

                                                                                                                                            useThrottleEffect: (
                                                                                                                                            effect: EffectCallback,
                                                                                                                                            deps?: DependencyList,
                                                                                                                                            options?: ThrottleOptions
                                                                                                                                            ) => void;

                                                                                                                                              function useThrottleFn

                                                                                                                                              useThrottleFn: <T extends noop>(
                                                                                                                                              fn: T,
                                                                                                                                              options?: ThrottleOptions
                                                                                                                                              ) => { run: any; cancel: () => void; flush: () => ReturnType<T> };

                                                                                                                                                function useTimeout

                                                                                                                                                useTimeout: (fn: () => void, delay?: number) => () => void;

                                                                                                                                                  function useTitle

                                                                                                                                                  useTitle: (title: string, options?: Options) => void;

                                                                                                                                                    function useToggle

                                                                                                                                                    useToggle: {
                                                                                                                                                    <T = boolean>(): [boolean, Actions<T>];
                                                                                                                                                    <T>(defaultValue: T): [T, Actions<T>];
                                                                                                                                                    <T, U>(defaultValue: T, reverseValue: U): [T | U, Actions<T | U>];
                                                                                                                                                    };

                                                                                                                                                      function useTrackedEffect

                                                                                                                                                      useTrackedEffect: <T extends DependencyList>(
                                                                                                                                                      effect: Effect<T>,
                                                                                                                                                      deps?: [...T]
                                                                                                                                                      ) => void;

                                                                                                                                                        function useUnmount

                                                                                                                                                        useUnmount: (fn: () => void) => void;

                                                                                                                                                          function useUnmountedRef

                                                                                                                                                          useUnmountedRef: () => MutableRefObject<boolean>;

                                                                                                                                                            function useUpdate

                                                                                                                                                            useUpdate: () => (this: unknown) => void;

                                                                                                                                                              function useVirtualList

                                                                                                                                                              useVirtualList: <T = any>(
                                                                                                                                                              list: T[],
                                                                                                                                                              options: Options<T>
                                                                                                                                                              ) => readonly [{ index: number; data: T }[], (this: unknown, index: number) => void];

                                                                                                                                                                function useWebSocket

                                                                                                                                                                useWebSocket: (socketUrl: string, options?: Options) => Result;

                                                                                                                                                                  function useWhyDidYouUpdate

                                                                                                                                                                  useWhyDidYouUpdate: (componentName: string, props: IProps) => void;

                                                                                                                                                                    Classes

                                                                                                                                                                    class CancelledError

                                                                                                                                                                    class CancelledError extends Error {}
                                                                                                                                                                    • Rejection reason used when useRequest ignores a request, either because cancel() was called (or the component unmounted), or because a newer call superseded it.

                                                                                                                                                                      It is swallowed by run/refresh, by options.onError and by the plugin onError handlers, so it only surfaces to code that awaits runAsync/refreshAsync directly.

                                                                                                                                                                    constructor

                                                                                                                                                                    constructor(message?: string);

                                                                                                                                                                      property [CANCELLED_ERROR_FLAG]

                                                                                                                                                                      readonly [CANCELLED_ERROR_FLAG]: boolean;
                                                                                                                                                                      • Marker that survives duplicated copies of the module, unlike instanceof.

                                                                                                                                                                      Package Files (81)

                                                                                                                                                                      Dependencies (8)

                                                                                                                                                                      Dev Dependencies (1)

                                                                                                                                                                      Peer Dependencies (2)

                                                                                                                                                                      Badge

                                                                                                                                                                      To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                                                                                                                      You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/ahooks.

                                                                                                                                                                      • Markdown
                                                                                                                                                                        [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/ahooks)
                                                                                                                                                                      • HTML
                                                                                                                                                                        <a href="https://www.jsdocs.io/package/ahooks"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>