老师 前几天面试官提的一个路由问题 当时不知道咋说 我在网上也没有找到好的访问 能解答一下嘛/(ㄒoㄒ)/~~
就是咱们再vue 路由跳转的时候 a跳b b跳c c再跳回a 这种实现方式是什么
咱这个课程里面只有个 $touter.back返回上一级上的
我在网上查到以一个 利用window.history.go(-window.history.length),
貌似是历史记录会话什么的， 里面涉及了 pushState 什么的我也一知半解没看懂
正在回答 回答被采纳积分+1
同学你好，如果没猜错的话，是想问同学 history 模式。这个问题本身就很偏向实战类的问题了，实际就在问同学在日常开发中是否用过这个模式进行开发，因为咱们课程中所讲的是hash模式，另使用history模式需要配合后端，所以课程里没有过多的讲。
接下来解释一下history 模式实现，多页面跳转跳转会第一个页面不重新刷新的需求。一般来说这种需求在掉token后当点击购买商品时会遇到验签（token）过期了，直接会跳转到登录页面重新登录，当登录完成自动会跳转会购买页面，且购买页面不再进行重新刷新。
它在于给予SPA应用（单页面应用）的路由管理的另一种方式而已，利用的是访问的会话历史记录进行跳转等。
history.pushState API，它是HTML5引入了history.pushState()和history.replaceState()方法。
同学举得例子中window.history.go(-window.history.length)返回第一个页面实则，要了解如下方法：
window.history.go(-2)--后退2页，相当于调用两次back();
window.history.go(1)--前进1页，相当于调用forward();
其中window.history是可以访问到length属性的，如果直接访问window.history.length是可以得到历史记录栈中一共有多少页，那么结合window.history.go(-2)--后退2页的来说，是不是就等于：
window.history.go(-window.history.length)这句话就相当于是后退到-length的页面，加入length是10那么就是后退10页了。
可以看看这个-->例子1或-->例子2-->关于浏览器的history API，详情文档请参阅 MDN：MDN history.
祝学习愉快！
-
回答这种问题，同学可以尝试以下几个维度进行回答：
1、首先讲一下history模式的由来如我上面说的它是利用了history.pushState API进行的路由跳转模其中包含history.pushState()和history.replaceState()方法。回答这些是你对history的理解。
2、然后可以告知history前端一方是不能满足需求的，需要后端配合共通完成。
3、前端这里需要将如下进行设置：
如mode属性设置为history
如需要在vue.config.js中设置publicPath字段
4、后端需要做的
1）如是nginx那么需要进行相关的配置。
2）如是Apache那么需要进行相关的配置。
3）如是nodejs那么需要进行相关的配置。
那么当配置好了以后可以在需要返回的页面进行window.history.go()调用就可以了（要注意-window.history.length不一定就是它，按需求进行跳转返回上一个页面就是-1）
如我上面说的例子：
1、一般来说这种需求在掉token后当点击购买商品时会遇到验签（token）过期了，直接会跳转到登录页面重新登录，当登录完成自动会跳转会购买页面，且购买页面不再进行重新刷新。
在登录页面中校验token时加入window.history.go(-1)返回即可（根据需求而定）
2、如a跳到b、b跳到c、c调回a。那么使用history模式。也可以这么用window.history.go(-window.history.length)在c页面调用时，因为window.history是可以访问length的，那么从a-c这个路径就犹如是[a.html,b.html,c.html]它的length就是3，window.history.go(-window.history.length)就等于window.history.go(-3)这样就可以跳转会a页面了。
如果以上答复还是没看明白回答的思路，那同学就不要硬记了。在后面的面试中面试官如果再问，你就如实回答不知道或者说知道什么说什么。因为他这么问，实际上就已经在考察你是否真的做过history的路由模式的实际开发了。在深入的问大概率会问你用这个模式你遇到过什么其他的坑没有，这时候你答不上来更难受。不如这时候就如实讲，你了解过这个方式，它是怎么用的。剩下的向面试官请教下。如您看我说的对不对，能不能给我讲讲，在补充一下。
这样我认为会更好。
祝学习愉快！
2023-03-22 17:26:27 -
好的 我大概捋清楚了， 原来有两种模式， 我看了点资料也明白个大概了，
咱这个项目确实不好用 history 需要后端配合
这种history模式咱只能后面工作中 或者实战中学习用了，
没办法阿，应届实习他问这个。。我不知道是不是深了，
话说还有一家面试，我就回答了个皮毛，那个面试官就以他的经验帮我补充了好多。
哎
https://blog.csdn.net/ZHANGYANG_1109/article/details/123687636
(109条消息) Vue的两种路由模式 和 History模式怎么配置_vue history路由_小刘先生很努力的博客-CSDN博客
2023-03-22 22:55:15
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星