timer.ts

export {};
import { shallowRef, onScopeDispose } from 'vue';
async function* timer(delay: number) {
  let breaked = false;
  const stop = () => (breaked = true);
  for (let i = 1, st = performance.now(), et = st, errorMs = 0; ; i++) {
    await new Promise((r) => setTimeout(r, delay - errorMs));
    yield stop;
    if (breaked) return;
    et = performance.now();
    errorMs = et - st - i * delay;
  }
}

let alive = true;
onScopeDispose(() => (alive = false));
const seconds = shallowRef(60);
const clickStart = async () => {
  for await (const _ of timer(1000)) {
    if (!alive) break;
    seconds.value -= 1;
    if (!seconds.value) break;
  }
};