路由跳转这么写！

一、路由跳转是什么？

Vue Router 是 Vue.js 官方的路由管理器。路由可以简单理解成指向，就是我在页面上触发点击事件时页面需要跳转到对应的页面，这就是路由跳转

二、实现方法

1、如果你只需要非常简单的路由而不想引入一个功能完整的路由库，可以像这样动态渲染一个页面级的组件

const routes = {
  '/': Home,
  '/about': About
}

2、在页面中直接跳转通过path传参数

this.$router.push({
            path: '/nextPage'
          });

3、在路由中跳转

（1）在src文件夹下新建router文件夹，在该文件夹下边新建index.js文件（前提是vue-cli已经构建好了构建一个vue的开发环境）

（2）配置index.js文件，首先引入vue以及vuerouter，然后导入已经定义好的路由实例，输入Vue.use(Router)使用router，接着定义路由,最后将router接口暴露出去（export defaut router）

 引入vue
import Vue from 'vue';

//引入VueRouter
import VueRouter from 'vue-router';

//引入HomeView页面Computer页面
import HomeView from '../views/HomeView.vue';
import HomeView from '../views/Computer.vue';

//引用第三方库时需要.use一下才能用
Vue.use(VueRouter);

//以数组形式定义routes路由的集合
const routes = [
  {
    //路径可以理解为url，在网页地址栏中可以看见
    path: '/',
    //名称
    name: 'home',
    //对应的页面组件组件
    component: HomeView
  },
  {
    path: '/Computer',
    name: 'Computer',
    component: () => import(/* webpackChunkName: "Computer" */ '../views/ComputerView.vue')
  },
];

//实例化VueRouter并将刚才创建好的routes路由集合添加进去
const router = new VueRouter({
//ES6简写，等于routes：routes
  routes
});

//暴露路由，抛出这个这个实例对象方便外部读取以及访问
export default router;

（3）在main.js中注入到实例中

持续整理中。。。。。。。