F5刷新之后 跑到首页去了，应当停留在本页面

最新推荐文章于 2023-07-24 14:13:33 发布
最新推荐文章于 2023-07-24 14:13:33 发布
阅读量3.2k 收藏 5
点赞数 1
分类专栏： 刷新之后页面跑到首页 文章标签： vue cookie
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_47581490/article/details/115322257
版权

F5刷新之后 跑到首页去了，应当停留在本页面

解决：
可能是由于路由守卫里面，刷新之后重定向了个router.push({name:“index”
}),把这个重定向给去掉
用路由守卫在控制台打印 from 若为null
那么就用下面的方法：将当前页面的路由存在cookie里；然后将路由重定向为当前页面，即router.push（{path:nowpage}）
可能是由于路由守卫里面，刷新之后重定向了个router.push({name:"index"})

现在几点，开心一点
关注
  • 1
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue 项目刷新页面, 保留当前页面状态
weixin_46317118的博客
02-27 8505
问题 : 在vue项目中,刷新页面之后,之前的登录信息, 打开的所有菜单,都消失, 如何实现刷新之后页面仍然是刷新之前的状态 解决 : 使用vuex状态管理, 搭配 , webstorage本地存储. 将vuex里面的数据同步更新到 localStorage/sessionStorage里存储 以登录信息为例: 每次登录成功, 将用户名存进webstorage(根据具体需求去选择localSt...
js禁止页面刷新禁止用F5键刷新禁止右键的示例代码
10-26
刷新禁止用F5键刷新禁止右键这些在某些特殊情况下还是比较实用的，下面有个不错的示例，感兴趣的朋友可以参考下
页面F5刷新后，页码默认回到1
renzhaya的博客
11-29 215
/ 原本这两行代码在watch监听$route变化后执行，为了在路由跳转完成后从新回到第一页(为了保证路由跳转之前修改完成本地存储中的sessionStorage数据)// 路由变化后把本地存储sessionStorage的属性currentPageNum从新设置成1(也就是第一页)// 自定义事件的回调函数---获取当前第几页(点击页码跳转并获取数据)// 为了在f5页面刷新后还能在当前页面，而不是返回第一页。// 为了在f5页面刷新后还能在当前页面，而不是返回第一页。// 监听到路由变化。
vue iframe 刷新保留在原来的页面
rojie0的博客
05-11 4503
页面刷新 iframe 保留在原来的页面
Vue如何保存当前页面的状态
qq_42676176的博客
03-13 1864
vue页面状态的保存
vue2.0 keep-alive 路由跳转之后保留当前页面数据不变动
hyduan_h5的博客
05-27 4260
需求： 1：页面一数据由接口返回，修改部分数据， 2：数据仅前端页面调整，暂未提交修改数据库。 3：页面一跳转页面二，再由页面二返回页面一 4：页面一数据仍为修改后的数据 实现： 1：借用方式：keep-alive 2：keep-alive是vue中的一个内置组件，主要是将组建缓存到内存中，避免切换路由的时候页面刷新从而导致dom的重新渲染 一：在vue.app中添加keep-alive标签。 <template> <div id="app"> <keep-al.
vue项目 刷新页面时跳转到首页，如何解决
最新发布
weixin_58794925的博客
07-24 1413
项目部署上去刷新页面时会跳转到首页 两种路由模式都会跳转，但是在本地是正常的，这到底是咋回事啊，各位大佬快帮看看。
禁止页面刷新让F5快捷键及右键都无效
09-04
禁止页面刷新让F5快捷键及右键都无效，下面有个不不错的实现方法，大家可以感受下
asp.net 处理F5刷新页面重复提交页面的一个思路
10-29
当提交完一个页面后，如果我们再次点击F5刷新该页面的话，会弹出一个提示，提示我们如果继续，则会重新发送提交我们刚才提交的内容，要是类似付款或一次性的操作，我们不应该这样操作，否则会造成重复提交的问题。
js 能实现监听F5页面刷新子iframe 而父页面不刷新的方法
10-21
下面小编就为大家带来一篇js 能实现监听F5页面刷新子iframe 而父页面不刷新的方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
解决vue项目F5刷新mounted里的函数不执行问题
10-16
在Vue.js开发过程中，我们经常会遇到这样一个问题：在F5刷新页面后，`mounted`钩子函数中的逻辑没有被执行，导致页面的一些功能无法正常运行。本文将深入解析这个问题的原因，并提供解决方案。 首先，理解Vue的生命...
vue项目刷新当前页面的三种方法
Free雅轩的博客
03-06 7万+
本文介绍了vue项目刷新当前页面的三种方法，本文图文并茂给大家介绍的非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下。 想必大家在刨坑vue的时候也遇到过下面情形：比如在删除或者增加一条记录的时候希望当前页面可以重新刷新或者如下面这种： 如果希望点击确定的时候，Dialog 对话框关闭的时候，当前http://localhost:9530/#/supplier/supplierAll页面可以重新刷新下 那么表格的数据可以重新加载，Dialog 对话框设置的数据可以在确定后刷新出现在页面上
vue点击事件会刷新浏览器回到主页解决办法
hlvy
11-26 6215
加个prevent阻止冒泡就好了  @click.prevent="toLink"  
刷新页面会导致页面路由重置的问题怎么解决
weixin_51654689的博客
05-28 2841
使用持久化存储：将路由信息存储在本地存储（如LocalStorage或SessionStorage）中，在应用程序初始化时从存储中读取路由信息，并恢复到相应的路由状态。这样在刷新页面后，可以从存储中获取路由信息，并重新导航到之前的路由。使用服务器端渲染（SSR）：使用服务器端渲染技术将Vue应用程序的初始状态和路由信息在服务器端生成，并在页面加载时将其提供给客户端。这样，刷新页面时，服务器会重新生成页面，并保持路由状态的一致性。使用路由懒加载：通过使用路由懒加载，可以将路由组件按需加载。
Vue中路由刷新后设置默认跳转页面（redirect）重定向
T8682828的博客
09-13 2742
Vue中路由刷新后设置默认跳转页面（redirect）重定项
vue中阻止F5刷新页面
ol_m_lo的博客
11-02 2160
vue项目如何刷新当前页面
热门推荐
回亦的博客
05-27 24万+
想必大家在刨坑vue的时候也遇到过下面情形：比如在删除或者增加一条记录的时候希望当前页面可以重新刷新或者如下面这种：如果希望点击确定的时候，Dialog 对话框关闭的时候，当前http://localhost:9530/#/supplier/supplierAll页面可以重新刷新下那么表格的数据可以重新加载，Dialog 对话框设置的数据可以在确定后刷新出现在页面上这时候我们最直接的思维就是想到下...
vue页面禁用f5刷新
03-30
在Vue中禁用F5刷新页面可以通过以下两种方法实现： 1. 使用路由守卫 在Vue中可以使用路由守卫来拦截用户的路由跳转，从而禁止F5刷新页面。在路由守卫中，可以检测到用户是否按下了F5键，如果是则阻止路由跳转。 示例代码： ```javascript // 在路由配置中添加beforeEach守卫 router.beforeEach((to, from, next) => { // 判断用户是否按下了F5键 if (event.keyCode === 116) { // 阻止路由跳转 event.returnValue = false next(false) } else { next() } }) ``` 2. 监听窗口事件 另一种方法是通过监听窗口事件来禁止F5刷新页面。在Vue中可以使用`created`钩子函数来添加窗口事件监听器，在事件监听器中判断用户是否按下了F5键，如果是则阻止默认行为。 示例代码： ```javascript export default { created() { // 监听窗口keydown事件 window.addEventListener('keydown', this.handleKeyDown) }, methods: { handleKeyDown(event) { // 判断用户是否按下了F5键 if (event.keyCode === 116) { // 阻止默认行为 event.preventDefault() } } }, destroyed() { // 在组件销毁时移除事件监听器 window.removeEventListener('keydown', this.handleKeyDown) } } ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值