vue3安装 router 路由

安装路由
cnpm i vue-router
 在src文件夹下创建router/index.ts
import {createRouter,createWebHashHistory} from 'vue-router'
const router=createRouter({
    history:createWebHashHistory(),
    routes:[
        {
            path:"/",
            name:'home',
            component: () => import('../views/Home/index.vue')
        }
    ]
})

export default router
在src/main.ts中导入挂载路由
import { createApp } from 'vue'
import './style.css'
import App from './App.vue'
import router from './router/index'

const app = createApp(App)
app.use(router)
app.mount('#app')
 在src文件夹下创建views/Home/index.vue





在src/App.vue中设置路由出口,其他内容都删除





运行项目直接就会出现首页  路由配置成功

vue3安装 router 路由_第1张图片

你可能感兴趣的:(javascript,前端,vue.js)