v3-use

Appearance

Return to top
On this page

useInterval

方便处理 setInterval 的 Hook。

Demo

</>
source
Please open console
<template>
  <div>Please open console</div>
  <button @click="run(true)">run(immediate)</button>
  <button @click="run()">run(3s后执行)</button>
  <button @click="destroy">destroy</button>
</template>

<script setup lang="ts">
import { useInterval } from 'v3-use'

// 立即执行
// useInterval(() => {
//   console.log('3s后执行')
// }, 3000, { immediate: true })

const { run, destroy } = useInterval(() => {
  console.log('3s后执行')
}, 3000)
</script>

Usage 

import { useInterval } from 'v3-use'

// 立即执行
// useInterval(() => {
//   console.log('3s后执行')
// }, 3000, { immediate: true })

const { run, destroy } = useInterval(() => {
  console.log('3s后执行')
}, 3000)

import { useInterval } from 'v3-use'

// 立即执行
// useInterval(() => {
//   console.log('3s后执行')
// }, 3000, { immediate: true })

const { run, destroy } = useInterval(() => {
  console.log('3s后执行')
}, 3000)

Reference

Type Declarations 

export interface Actions {
  run: (immediate?: boolean) => void
  destroy: () => void
}
export declare function useInterval(
  fn: () => void,
  delay: number,
  options?: {
    immediate?: boolean
  }
): Actions

export interface Actions {
  run: (immediate?: boolean) => void
  destroy: () => void
}
export declare function useInterval(
  fn: () => void,
  delay: number,
  options?: {
    immediate?: boolean
  }
): Actions