본문으로 건너뛰기

인터페이스: ReactAsyncRateLimiter<TFn, TSelected>

정의 위치: react-pacer/src/async-rate-limiter/useAsyncRateLimiter.ts:24

확장​

  • Omit<AsyncRateLimiter<TFn>, "store">

타입 매개변수​

TFn​

TFn extends AnyAsyncFunction

TSelected​

TSelected = { }

속성​

state​

readonly state: Readonly<TSelected>;

정의 위치: react-pacer/src/async-rate-limiter/useAsyncRateLimiter.ts:50

요청률 제한기 상태가 변경될 때 업데이트되고 다시 렌더링되는 반응형 상태입니다.

rateLimiter.store.state 대신 사용합니다.

store​

readonly store: Store<Readonly<AsyncRateLimiterState<TFn>>>;

정의 위치: react-pacer/src/async-rate-limiter/useAsyncRateLimiter.ts:56

지원 중단 예정​

반응형 상태를 읽으려면 rateLimiter.state를 사용하고 rateLimiter.store.state는 사용하지 않습니다. 스토어 객체의 상태는 내부에서 useSelector 훅으로 래핑되지 않았으므로 반응형이 아닙니다. 다만 직접 사용할 때 useSelector를 적용하면 상태를 반응형으로 만들 수 있습니다.

Subscribe()​

Subscribe: <TSelected>(props) => ReactNode | Promise<ReactNode>;

정의 위치: react-pacer/src/async-rate-limiter/useAsyncRateLimiter.ts:41

요청률 제한기 상태를 구독할 수 있는 React HOC(Higher Order Component)입니다.

요청률 제한기 상태의 특정 부분에 대한 재렌더링을 선택적으로 활성화할 때 유용합니다. 훅에 셀렉터를 전달하지 않고도 컴포넌트 트리 깊은 곳에서 사용할 수 있습니다.

타입 매개변수​

TSelected​

TSelected

매개변수​

props​
children​

ReactNode | (state) => ReactNode

selector​

(state) => TSelected

반환값​

ReactNode | Promise&lt;ReactNode>

예시​

<rateLimiter.Subscribe selector={(state) => ({ rejectionCount: state.rejectionCount, isExecuting: state.isExecuting })}>
  {({ rejectionCount, isExecuting }) => (
    <div>Rejected: {rejectionCount}, {isExecuting ? 'Executing' : 'Idle'}</div>
  )}
</rateLimiter.Subscribe>