vue路由配置（从0开始）

1，首先在全局下安装路由

npm install vue-router --save

2,一般情况下我们都会把路由单独抽离出来，在src下面新建一个router.js 文件，或者新建一个router文件夹，然后在文件夹里面新建一个index.js

 

 

3,编写好对应的几个组件，然后在router.js里面编写路由,实现组件之间的跳转,格式如下：

import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
const router = new Router({
	routes: [
		{path:"/",redirect:'/home'},
		{
			path:'/home',
			component:()=>import('../components/home.vue')
		},
		{
			path:'/order',
			component:()=>import('../components/order.vue')
		},
		{
			path:'/login',
			component:()=>import('../components/login.vue')
		}]
})

4，在main.js里面引用刚才配置好的路由

 

 5,到这里整个路由就配置完成了，在地址栏里面切换就能看到效果了