vue2路由传值方式/跳转方式/以及实现原理？

1, vue路由的实现原理?
   监听的是onhashchange事件， 根据哈希值变化来实现页面的切换， 通过vue-router.js创建路由器对象，添加路由匹配规则，需要注册在根组件里面，通过router-link实现跳转 ，通过router-view实现路由组件展示

---

 

2, vue路由的配置步骤
    (1) 导入vue路由第三方
    (2) 添加router-link 标签
    (3) 添加路由组件
    (4) 创建路由对象 添加路由匹配
    (5) 根组件注册路由器对象
    (6) 添加router-view 展示路由组件

---

3, 路由有哪两种跳转方式?
   声明式导航跳转  router-link
   编程式导航跳转 push("/login") push({path:""}) push({name:"组件name属性"})

---

4, this.$router 和  this.$route 的区别?
    全局路由器对象 包含各个组件的路由对象信息
    this.$route 当前页的路由对象

---

 

5, vue路由有哪四种传值方式?
    (1)url拼接键值对传值  使用$route.query接收
    (2)动态url/友好型url传值   使用$route.params接收
    (3)路径跳转+query对象传值  使用$route.query接收
    (4)命名路由+params对象传值  使用$route.params接收
    注: path路径跳转只可以携带query参数, name路由名跳转可以携带params参数和query参数

---

6, vue路由四种传值方式的优缺点对比
    四种方式中, 1,2,3方式都是把参数拼到了url路径上, 而第4种方式的params参数没有在路径上拼接(第4种方式的query参数也是在url上拼接的)
    在url路径上拼接参数, 好处是: 页面刷新时数据不丢失 , 弊端是: 安全性低,且数据大小限制
    第4种方式的params参数 好处: 安全性高,且数据大小无限制, 弊端是: 页面刷新, 数据会丢