Skip to content

useInterval

Category
Export Size
461 B
Last Changed
4 months ago

Reactive counter increases on every interval

Demo

Interval fired: 33

Usage

ts
import { 
useInterval
} from '@vueuse/core'
// count will increase every 200ms const
counter
=
useInterval
(200)
ts
const { 
counter
,
reset
,
pause
,
resume
} =
useInterval
(200, {
controls
: true
})

Type Declarations

ts
export interface 
UseIntervalOptions
<
Controls
extends boolean> {
/** * Expose more controls * * @default false */
controls
?:
Controls
/** * Execute the update immediately on calling * * @default true */
immediate
?: boolean
/** * Callback on every interval */
callback
?: (
count
: number) => void
} export interface UseIntervalControls {
counter
:
ShallowRef
<number>
reset
: () => void
} export type
UseIntervalReturn
=
|
Readonly
<
ShallowRef
<number>>
|
Readonly
<UseIntervalControls &
Pausable
>
/** * Reactive counter increases on every interval * * @see https://vueuse.org/useInterval * @param interval * @param options */ export declare function
useInterval
(
interval
?:
MaybeRefOrGetter
<number>,
options
?:
UseIntervalOptions
<false>,
):
Readonly
<
ShallowRef
<number>>
export declare function
useInterval
(
interval
:
MaybeRefOrGetter
<number>,
options
:
UseIntervalOptions
<true>,
):
Readonly
<UseIntervalControls &
Pausable
>

Source

SourceDemoDocs

Contributors

Anthony Fu
IlyaL
Jelf
SerKo
Robin
Anthony Fu
mohammadhosry
Waleed Khaled
vaakian X
Nurettin Kaya

Changelog

v13.1.0 on
c1d6e - feat(shared): ensure return types exists (#4659)
v12.8.0 on
7432f - feat(types): deprecate MaybeRef and MaybeRefOrGetter in favor of Vue's native (#4636)
v12.0.0-beta.1 on
0a9ed - feat!: drop Vue 2 support, optimize bundles and clean up (#4349)
v10.0.0-beta.4 on
4d757 - feat(types)!: rename MaybeComputedRef to MaybeRefOrGetter

Released under the MIT License.

Build faster with AI
New Masterclass to help you leverage AI in your Vue workflow
Get Early Access