Vue路由

1.什么是路由？

一个路由就是一种映射关心（key-value）

key为路径，value可能为function或componen

2.基本路由

1.安装vue-router，命令 npm i vue-router

2.应用插件 Vue.use(VueRouter)

3.编写router配置项

//index.js界面
import VueRouter from 'vue-router'       //引入VueRouter
import About from '@/components/About'   //路由插件
import Home from '@/components/Home'     //路由插件
 
export default new VueRouter({
    routes: [
        {
            path:'/About',
            component:About
        },
        {
            path:'/Home',
            component:Home
        }
    ]
})

//home界面
<template>
    <div>
        <h1>我是home组件</h1>
    </div>
</template>
 
<script>
export default {
    name:'Home',
    mounted(){
        console.log("home组件即将被挂载");
    }，
beforeDestroy() {
       console.log("about组件即将被销毁");
    }
}
</script>
 
<style>
 
</style>