前端常见问题汇总(八)

一、vuex的使用过程

二、vue路由实现原理

Vue Router 路由实现原理

通过改变 URL,在不重新请求页面的情况下,更新页面视图

Vue的两种路由模式:

  1. hash路由(利用 URL 中的hash("#"))
  2. history路由 (在HTML5中新增的方法)

对于vue开发的单页面应用,我们在切换不同的页面的时候,可以发现html永远只有一个,这也真是称之为单页面的原因,而vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载。而当开启history模式的时候,如果后端不进行任何处理,在Dev阶段一切都是正常的,可是打包之后,访问路径则会返回404,因此要在服务端增加一个覆盖所有情况的候选资源:如果 URL 匹配不到任何静态资源,则应该返回同一个 index.html 页面,这个页面就是app 依赖的页面。

三、vue-router路由权限控制的两种实现方案

  • 通过vue-router addRoutes 方法注入路由实现控制
    在这里插入图片描述

  • 通过vue-router beforeEach 钩子限制路由跳转

vue权限管理和使用addRoutes动态加载路由
vue-router路由权限控制的两种实现方案

猜你喜欢

转载自blog.csdn.net/qq_39490750/article/details/113918537