TypeScript - Vue+TS لا يمكن الوصول إلى * قبل التهيئة؟

الحصول على الخطأ لا يمكن الوصول إلى 'AuthCallback' قبل التهيئة عند استدعاء دالة الراوتر في مكون AuthCallback، ما الخطأ؟ الوظيفة التي أحتاجها هي - عندما يقوم المستخدم بتسجيل الدخول، يتم تحويله إلى صفحة الاستدعاء، وبعدها مباشرة إلى صفحة الملف الشخصي، لكن هذا هو الخطأ الذي أحصل عليه إذا حاولت توصيل الراوتر

router.ts

import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router'
import main from '../layout/main-layout.vue'
import AuthCallback from '../components/user/user-interact/user-callback.vue'
import Profile from '../components/user/user-profile/user-profile.vue'

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/',
      name: 'main',
      component: main
    },
    {
      path: '/callback/:',
      name: 'AuthCallback',
      component: AuthCallback
    },
    {
      path: '/id/:usedId',
      name: 'Profile',
      component: Profile
    }
  ]
})

export default router

user-callback.vue

<script lang="ts">
    import { useRoute } from 'vue-router';
    import router  from '../../../router/index.ts';
    import { store } from '../../../stores/userState.ts'
    
    export default {
        name: 'AuthCallback',
        mounted() {
            const tokenParseRegex: RegExp = /access_token=(.*?)&/;
            const idParseRegex: RegExp = /user_id=(.*?)$/;
            const exAccessToken: RegExpMatchArray | null = useRoute().hash.match(tokenParseRegex);
            const exUserId: RegExpMatchArray | null = useRoute().hash.match(idParseRegex);
            if (exAccessToken![1] !== null) {
                store().userState.accessToken = exAccessToken![1];
                store().userState.userId = exUserId![1];
                store().userState.isAuthorized = true;
            } else {
                return
            }
            if (store().userState.accessToken !== null) {
                    console.log(router()) // if i remove this line - all be fine
            }
        }   
    }
</script>

الإجابة رقم 1

كما هو مذكور في الوثائق https://router.vuejs.org/guide/essentials/navigation.html :

داخل نسخة Vue، يمكنك الوصول إلى نسخة الموجّه باسم $router. لذلك يمكنك استدعاء this.$router.push.

لذلك، في ملف user-callback.vue الخاص بك، دون استيراد router/index.ts، فقط قم باستدعاء this.$router.push('/something')

أو، يمكنك استخدام useRouter():

import { useRouter } from 'vue-router';
const router = useRouter(); 

router.push('/something')