[Vuejs]-Component not firing after onMounted is called

Here is a working example:

<script setup lang="ts">
import { defineProps, ref, onMounted, toRef } from "vue";

const props = defineProps<{
  time: number;
}>();

const counter = ref(props.time); // set a proper ref that can be mutated

const counterFunc = () => {
  setInterval(() => {
    counter.value = counter.value - 1; // mutate the ref as expected
    if (counter.value == 0) {
      console.log("clearError"); // replace with your clear error function
    }
  }, 1000);
};

onMounted(counterFunc);
</script>

<template>
  {{ counter }}
</template>

You can try it here: https://codesandbox.io/s/heuristic-stallman-niiqzl?file=/src/App.vue:0-419