I am encountering an issue with my code where I get the error "Cannot access 'AuthCallback' before initialization" when attempting to call the router function in the AuthCallback component. What could be causing this problem? The desired functionality is as follows: When a user logs in, they should be redirected to the callback page and then immediately to the profile page. However, I keep running into this error whenever I try to connect my router.
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>