10.16日记

在src目录下创建路由文件目录，目录名为“router”，并在该目录下创建“index.js”文件，文件内容如下所示，代码中，创建了一个路由器，其中配置了两个路由“about”和“home”,分别对应组件“About”和“Home”。

// 该文件专门用于创建整个应用的路由器
import VueRouter from 'vue-router'
//引入组件
import About from '../components/About'
import Home from '../components/Home'

//创建并暴露一个路由器
export default new VueRouter({
    routes:[
    	{
    		path:'/about',
    		component:About
    	},
    	{
    		path:'/home',
    		component:Home
    	}
    ]
})

随后，还需要在main.js文件中引入并应用路由：

//引入Vue
import Vue from 'vue'
//引入App
import App from './App.vue'
//引入VueRouter
import VueRouter from 'vue-router'
//引入路由器
import router from './router'

//关闭Vue的生产提示
Vue.config.productionTip = false
//应用插件
Vue.use(VueRouter)

//创建vm
new Vue({
    el:'#app',
    render: h => h(App),
    router:router
})