vue是一个单页面利用,所有页面跳转都是通过路由来实现
上面开始路由的配置:{路由文件:router中的index.js文件}
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
引入并应用路由

const home = () => import('../views/home-index.vue');//开始咱们先引入一个路由页面{应用了路由懒加载,和图片懒加载的情理差不多,只有在跳转的时候才会加载进去,避免首次进入的时候耗费过多的工夫}const routes = [{  path: '/',  name: 'home',  component: home,}, {  path: '/signIn',  name: 'signIn',  component: signIn,  meta: {    title: '登录'  },]//这里我配置了两个路由{没有全副引入}})export default router

首先开始介绍属性:
path:这个是地址栏下面显示的值{例:www.taobao.com/user。这里user就是那个path}

name:一个命名相似于给这个路由增加了一个id在组件中应用路由跳转的时候会用到{编程式导航}相似于window.open那种

component:这个值算是比拟要害的就是组件的名字,要和引入时的值放弃对应,比方:path:user对应user的组件

在理论开发中可能会遇到一些问题;我想在首页路由中切换一部分怎么办?在登录和注册页面进行路由互相调换怎么办?
路由还提供了一种children模式

const routes = [{  path: '/',  name: 'home',  component: home,  children: [{ // home的子组件    path: '',    name: 'homeIndex',    component: homeIndex  }, {    path: '/user',    name: 'user',    component: user,  }]} ]

咱们创立一个children数组在数组中创立路由对象就能够了,
在组件中还是失常跳转

const router = new VueRouter({
// mode: 'history', //勾销历史模式
// base: '/dist',
routes
})