vue的路由

一、前端路由和后端路由 

先说下后端路由

后端路由，就是把所有url地址都对应到服务器的资源，这个对应关系就是路由 

那么前端路由是什么？

对于单页面应用程序来说，主要通过URL中的hash（url地址中的#号）来实现不同页面之间的切换。同时，hash有一个特点：HTTP请求中不会包含hash相关的内容。所以，单页面程序中的页面跳转主要用hash实现。

 前端路由总结：在单页应用程序中，这种通过hash改变来切换页面的方式，称作前端路由（区别于后端路由）

二、基本配置

 因为我们平常是用脚手架创建项目的，路由的基本配置都配置好了，主要是在router文件夹下的index.js里要注册和使用

import Vue from 'vue'
import SecondView from '../components/SecondView.vue' // 引入组件
import FirstView from '../components/FirstView.vue'  //  引入组件
import ThirdView from '../components/ThirdView.vue' // 引入组件

import VueRouter from 'vue-router' // 注册路由
Vue.use(VueRouter) // 使用

//配置路由
const routes = [
  {
    path: '/',               // 路由匹配的hash地址 初始页面可以直接写一个/
    name: 'FirstView',       // 组件名
    component: FirstView     // 表示路由规则对应要展示的组件对象
  },
  {
    path: '/SecondView',
    name: 'SecondView',
    component: SecondView
  },
  {
    path: '/ThirdView',
    name: 'ThirdView',
    component: ThirdView
  }
]

 在app.vue中使用

    <router-link to="/">我是首页</router-link>
    <router-link to="/SecondView">我是第二页</router-link>

 如果是在初始页的话，他显示一个/

 如果是跳转到第二页的话，路由后面会拼接去往的地址