前端路由
根据不同的 url 地址展示不同的内容或页面，无需依赖服务器根据不同URL进行页面展示操作
优点
缺点
一、路由（以user为例）
user-->用户列表页的路由所加载的代码
import Vue from ‘vue‘ //引入vue
import Router from ‘vue-router‘ //引入vue-router
import User from ‘@/components/user‘ //引入根目录下的user.vue组件
Vue.use(Router) //vue全局使用Router
export default new Router({
routes: [ //配置路由，这里是个数组
{
path: ‘/user‘, //链接路径
name: ‘user‘, //路由名称
component: User //对应的组件模板
}
]
})
user-->用户列表页代码
<template> <div>展示用户列表页</div> </template> <script> export default { name: ‘User‘, data () { return { msg: ‘‘ } } } </script> <style scoped> </style>
打开网址：http://localhost:8080/#/user 显示如上模板解析页。
注意：其中 # 为哈希，mode:hash 若要用原始类型的网址，则mode:history。
二、动态路由匹配
| 模式 | 匹配路径 | 获取动态路由参数 |
| /user/:username | /user/nina | $route.params.username |
| /user?:username | /user?username=nina | $route.query.username |
原文：https://www.cnblogs.com/qdwz/p/10831955.html