use-queue

use-queue

제한된 크기의 큐(queue)를 관리하는 훅이에요. 큐에 항목을 추가하면 제한된 개수를 넘는 오래된 항목은 상태(state)에서 제거되요.

출처: 문서

본문

사용법 (Usage)

initialValues를 제공하지 않는다면 상태 항목에 대한 타입을 넘겨줘요.

import { useQueue } from '@mantine/hooks';

const q = useQueue({
  limit: 2,
  initialValues: [],
});

q.add({ name: 'Bob', id: 1 });

정의 (Definition)

export interface UseQueueOptions {
  /** Initial values to be added to the queue */
  initialValues?: T[];

  /** Maximum number of items in the state */
  limit: number;
}

export interface UseQueueReturnValue {
  /** Array of items in the queue */
  queue: T[];

  /** Array of items in the state */
  state: T[];

  /** Function to add items to state or queue */
  add: (...items: T[]) => void;

  /** Function to apply updates to current items */
  update: (fn: (state: T[]) => T[]) => void;

  /** Function to clear the queue */
  cleanQueue: () => void;
}

function useQueue(options: UseQueueOptions): UseQueueReturnValue

내보내는 타입 (Exported types)

UseQueueOptions와 UseQueueReturnValue 타입은 @mantine/hooks 패키지에서 내보내져요. 애플리케이션에서 임포트할 수 있어요.

import type { UseQueueOptions, UseQueueReturnValue } from '@mantine/hooks';

더 알아보기 (Learn more)