今天的码农女孩做了关于vue路由的笔记、例子以及简答题

路由 
路由是用来跳转路径的，但是vue是单页面开发，所有路由没有跳转新页面，而是切换了不同组件进行显示
例如：
   <div id="app">
        <router-link to="/a">登录</router-link><!--超链接跳转-->
        <router-link to="/b">注册</router-link>
        <router-view></router-view><!--显示组件-->
    </div>
    <script>
        //创建两个页面的组件
        var login={template:'<div><h2>这是登录页面</h2></div>'}
        var res={template:'<div><h2>这是注册页面</h2></div>'}
        var routes=[//配置组件的路径
            {path:'/a',component:login},
            {path:'/b',component:res},
        ]
        var router=new VueRouter({routes})//创建路由对象
        new Vue({
            el:"#app",
            router//应用路由
        })
    </script>
路由的属性参数
to 定义跳转路径
replace 设置导航跳转后，不被history对象记录
tag 让路由更换html标签显示
active-class 路由被激活的样式，但是必须是class属性名
event 改变路由所触发的事件，默认是点击
append 设置路由查找子文件夹路径 /a/b
例如：
 <router-link to="/a" replace tag="li" active-class="box" event="mouseover">登录</router-link>

简答：路由有几种定义模式？

hash模式：路径后面会带#，使用url的hash值来作为路由，支持所有浏览器，缺点是只能改变#后面的名称来实现路由跳转。

history模式：可以像正常定义路径一样，会存储历史记录，缺点是刷新页面时，如果请求了后台服务器，每次刷新都会重新请求一次，就会耗时。

abstract模式：适用于所有js环境，也可以在node.js里使用，如果没有浏览器API，路由将自动被降职进入此模式。

引用createWebHistory对象是调用history模式

引用createWebHashHistory对象是调用hash模式

$route和$router的区别
$route是“路由信息对象”，包括path，params，hash，query，fullPath，matched，name等路由信息参数。而$router是“路由实例”对象包括了路由的跳转方法，钩子函数等。