I am trying to route to another page within a function within in a component. I can't call this.$router.push() and get the following errors:

Compiled with problems:X

ERROR in src/components/ButtonList.vue:118:16

TS2339: Property '$router' does not exist on type 'RenderFunction | { showLoading(): void; todoCount: ComputedRef<number>; clickCount: Ref<number>; increment: () => number; } | Promise<{ showLoading(): void; todoCount: ComputedRef<...>; clickCount: Ref<...>; increment: () => number; }>'.
  Property '$router' does not exist on type 'RenderFunction'.
    116 |           $q.loading.hide();
    117 |           timer = void 0;
  > 118 |           this.$router.push('step-02');
        |                ^^^^^^^
    119 |         }, 2000);
    120 |       },
    121 |     };


ERROR in src/components/ButtonList.vue:118:11

@typescript-eslint/no-unsafe-member-access: Unsafe member access .push on an `any` value.
    116 |           $q.loading.hide();
    117 |           timer = void 0;
  > 118 |           this.$router.push('step-02');
        |           ^^^^^^^^^^^^^^^^^
    119 |         }, 2000);
    120 |       },
    121 |     };


ERROR in src/components/ButtonList.vue:118:11

@typescript-eslint/no-unsafe-call: Unsafe call of an `any` typed value.
    116 |           $q.loading.hide();
    117 |           timer = void 0;
  > 118 |           this.$router.push('step-02');
        |           ^^^^^^^^^^^^^^^^^
    119 |         }, 2000);
    120 |       },
    121 |     };

Any ideas how to fix this? I got a button which should route to the next page after a delay - therefore the setTimeout function.