Skip to content
On this page

useTimeout

Category
Last Changed
3 months ago

Update value after a given time with controls.

Demo

Ready: false

Usage

import { promiseTimeout, useTimeout } from '@vueuse/core'

const ready = useTimeout(1000)
import { promiseTimeout, useTimeout } from '@vueuse/core'

const ready = useTimeout(1000)
const { ready, start, stop } = useTimeout(1000, { controls: true })
const { ready, start, stop } = useTimeout(1000, { controls: true })
console.log(ready.value) // false

await promiseTimeout(1200)

console.log(ready.value) // true
console.log(ready.value) // false

await promiseTimeout(1200)

console.log(ready.value) // true

Type Declarations

export interface TimeoutOptions<Controls extends boolean>
  extends TimeoutFnOptions {
  /**
   * Expose more controls
   *
   * @default false
   */
  controls?: Controls
}
/**
 * Update value after a given time with controls.
 *
 * @see   {@link https://vueuse.org/useTimeout}
 * @param interval
 * @param immediate
 */
export declare function useTimeout(
  interval?: number,
  options?: TimeoutOptions<false>
): ComputedRef<boolean>
export declare function useTimeout(
  interval: number,
  options: TimeoutOptions<true>
): {
  ready: ComputedRef<boolean>
} & Stoppable
export interface TimeoutOptions<Controls extends boolean>
  extends TimeoutFnOptions {
  /**
   * Expose more controls
   *
   * @default false
   */
  controls?: Controls
}
/**
 * Update value after a given time with controls.
 *
 * @see   {@link https://vueuse.org/useTimeout}
 * @param interval
 * @param immediate
 */
export declare function useTimeout(
  interval?: number,
  options?: TimeoutOptions<false>
): ComputedRef<boolean>
export declare function useTimeout(
  interval: number,
  options: TimeoutOptions<true>
): {
  ready: ComputedRef<boolean>
} & Stoppable

Source

SourceDemoDocs

Contributors

Anthony Fu
Shinigami
Mark Noonan

Changelog

v6.9.2 on 11/19/2021
80409 - fix: interface typos (#938)
useTimeout has loaded