[vue3 routing] Click the button and jump to the page

/home.vue page code:

<template>
    <el-button class="btu" @click="goEcharts">点击进入echarts</el-button>
</template>

import { useRouter } from 'vue-router';
const router = useRouter();
function goEcharts(){
    router.push({path:'/echarts'})
}

/router/index.ts page code:

import { createRouter, createWebHistory } from "vue-router";
 
 
let routes= [
    {
        path: '/',
        name: 'home',
        //使用import可以路由懒加载,如果不使用,太多组件一起加载会造成白屏
        component: () => import('../view/home.vue')
        
    },
    {
        path:'/echarts',
        name:'echart',
        component:() => import('../view/echarts.vue')
    }
    // {
    //     // 配置404页面
    //     path: '/:catchAll(.*)',
    //     name: '404',
    //     component: () => import(''),
    // }
]
// 路由
const router = createRouter({
    history: createWebHistory(),
    routes
})
// 导出
export default router 

Guess you like

Origin blog.csdn.net/m0_67986791/article/details/129800351