简单路由器 link 不工作,如何转到 Vuejs 3 中的另一个 vue 页面

simple router link not working, how to go to another vue page in Vuejs 3

我正在学习一些 Vue 教程并测试一个项目,我的简单 link (Let's Play) is not working.no 编译错误。编译成功。只是 link 不起作用,url 也没有改变。现在我卡住了。请帮忙。对不起,如果我的英语不好。这是 src/views/LandingPage.vue

<template>
<div>
    <h1>Welcome </h1>
  
    ကြိုဆိုပါတယ် {{ user['first_name'] }} {{ user['last_name'] }} 
    <br>
     <router-link to="/choose-topic">Lets Play</router-link>
</div>
<router-view/>
</template>


<script>

这是 src/main.js

中的 main.js
import LandingPage from './views/LandingPage.vue'
import { createApp } from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'
import router from 'vue-router'


createApp(LandingPage).use(VueAxios, axios,router).mount('#app')

这是src/router/index.js

import {createRouter, createWebHistory} from 'vue-router'

import ChooseTopic from '../views/ChooseTopic.vue'

const routes = [

    
    {
        path: '/choose-topic',
        name: 'ChooseTopic',
        component: ChooseTopic
    }
]

const router = createRouter({
    history: createWebHistory(process.env.BASE_URL),
    routes
})

export default router

好的,我现在可以使用了。我做的步骤 我创建新项目以自动包含路由器并降级以使用 Vue 2 而不是 Vue 3 我必须在 App.vue

中包含 <router-view/> 这个