v3-use

Appearance

Return to top
On this page

useTimeout

一个可以处理 setTimeout 的 Hook

Demo

</>
source
ouput: 0
<template>
  <button @click="run()">3s后执行</button>
  <button @click="destroy()">destroy</button>
  <div>ouput: {{ state }}</div>
</template>

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

const [state, setState] = useState(0)
const { run, destroy } = useTimeout(() => {
  setState(c => c + 1)
}, 3000)
</script>

Usage 

import { useTimeout, useState } from 'v3-use'
const [state, setState] = useState(0)
const { run, destroy } = useTimeout(() => {
  setState(c => c + 1)
}, 3000)

import { useTimeout, useState } from 'v3-use'
const [state, setState] = useState(0)
const { run, destroy } = useTimeout(() => {
  setState(c => c + 1)
}, 3000)

Reference 

const actions = useTimeout(fn: () => void, delay: number)

const actions = useTimeout(fn: () => void, delay: number)

Type Declarations 

export interface Actions {
  run: () => void
  destroy: () => void
}
export declare function useTimeout(fn: () => void, delay: number): Actions

export interface Actions {
  run: () => void
  destroy: () => void
}
export declare function useTimeout(fn: () => void, delay: number): Actions