vueCli中路由配置

1.在index.js中引入路由模块配置

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import Home from '@/components/Home'
import About from '@/components/About'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    },
    {
      path: '/home',
      component: Home
    },
    {
      path: '/about',
      component: About
    },
  ]
})

2.在App.vue中使用一下路由就可以了，当然哪里需要就在那里用也可以，就相当于超链接一样，当然不要忘记<router-view></router-view>写在组件想要渲染的地方,等组件跳转过来就渲染。

<template>
  <div id="app">
    <app-header></app-header>
    <router-link to="/home">首页</router-link>
    <router-link to="/about&#