useInterval 组合式API
Quasar v2.15.1+

useInterval() 组合式API在功能上类似于原生的 setInterval()，但有一些关键区别。该组合式API会在组件被销毁时自动"取消"定时器，并且您还可以在定时器运行时覆盖执行的函数。

在 SSR 服务端，注册定时器是一个空操作（no-op）。请在组件渲染生命周期之外显式启动服务端任务，而不是在 setup() 中创建定时器。

语法

import { useInterval } from 'quasar'

setup () {
  const {
    registerInterval,
    removeInterval
  } = useInterval()

  // ...
}

function useInterval(): {
  registerInterval(fn: () => void, interval?: string | number): void;
  removeInterval(): void;
};

示例

import { useInterval } from 'quasar'

setup () {
  const { registerInterval } = useInterval()

  function onSomeEvent (param) {
    registerInterval(() => {
      console.log('参数是', param)
    }, 2000) // 每2秒执行一次
  }

  // ...

  // 您可以连续多次调用onSomeEvent()，
  // 但只有最后一次注册的函数会在
  // 到达执行时间时运行

  // 请注意，每次注册/覆盖时
  // 定时器都会重置
}

如果您需要在一个组件中使用多个useInterval()，只需重命名返回对象中的函数：

const { registerInterval: registerFirstInterval, removeInterval: removeFirstInterval } =
  useInterval();

const { registerInterval: registerSecondInterval, removeInterval: removeSecondInterval } =
  useInterval();

Caught a mistake?Edit this page in browser

useInterval 组合式API Quasar v2.15.1+

语法

示例

useInterval 组合式API
Quasar v2.15.1+