自学内容网 自学内容网

VUE之Router使用及工作模式

1、路由的使用

【两个注意点】

1)路由组件通常放在pages 或 views文件夹,一般组件通常放在components文件夹。

2)通过点击导航,视觉效果上"消失"了的路由组件,默认是被"卸载"掉的,需要的时候再去挂载。

// 创建一个路由器,并暴露出去

// 第一步:引入createRouter
import {createRouter,createWebHistory} from 'vue-router'
// 引入一个个可能呈现组件
import Home from '@/pages/Home.vue'
import News from '@/pages/News.vue'
import About from '@/pages/About.vue'

// 第二步:创建路由器
const router = createRouter({
    history:createWebHistory(), //路由器的工作模式
    routes:[  //一个个路由规则
        {
            path:'/home',
            component: Home
        },
        {
            path:'/news',
            component: News
        },
        {
            path:'/about',
            component: About
        },
    ]
})

export default router
i

原文地址:https://blog.csdn.net/qq_22111417/article/details/145270207

免责声明:本站文章内容转载自网络资源,如侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!