/** * 定时执行器 interval hook * @param { functioin } callback 回调 * @param { number } t 时间间隔 * @return * run() 启动定时器 * stop() 关闭定时器 * isRun.value 是否运行中 * setCallback() 设置回调 */ export function useTimeLoop (callback, t = 30){ const { state: isRun, setTrue, setFalse } = useBool() const time = ref(null) const cb = ref(callback) const stop = () => { clearInterval(time.value) setFalse() time.value = null } const run = (...args) => { stop() setTrue() time.value = setInterval(cb.value, t * 1000, ...args) } const setCallback = callback => cb.value = callback return { run, stop, isRun, setCallback } } /** * 定时器 timeout * @summary * 使用 timeout 实现的定时器,兼容Promise回调, * 当回调返回Promise时,将等待Promise执行完成后, * 出入下一次计时 * @param { functioin | Promise } callback 执行回调 * @param { number } t 时间间隔 * @returns { Object } * run() 启动定时器 * stop() 关闭定时器 * isRun.value 是否运行中 * setCallback() 设置回调 * * @exmaple * const { run, stop, isRun } = useTimeout() * async function update(){ * try{ * await API.update() * }catch(e){ * console.error(e) * stop() * } * } * * @tips * 中断处理: * 对于callback为Promise的情况, callback内执行stop。 * 存在clearTimeout无法中断循环的情况, 主要因为clearTimeout清理的是timeout的执行, * 必须在回调执行前。 * 所以 run 循环需要通过 isRun 判断是否执行下一计时器. * 统一将中断封装为 stop 函数 * */ export function useTimeout(callback, t){ const { state: isRun, setTrue, setFalse } = useBool() const time = ref(null) const cb = ref(callback) const stop = () => { clearTimeout(time.value) time.value = null setFalse() } const run = (...args) => { setTrue() time.value = setTimeout(async () => { await callback(...args) isRun.value && run() }, t * 1000) } const setCallback = callback => cb.value = callback return { run, stop, isRun, setCallback } }
本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。
我来说两句