vue在刷新页面后如何保证路由不变

1126 ℃

vue开发中,如何在刷新页面后保证路由不会变化,下面web建站小编给大家简单介绍一下!

具体代码如下:

export default {
  created() {
    // 监听beforeunload事件
    window.addEventListener("beforeunload", this.saveCurrentPath)
  },
  beforeDestroy() {
    // 解除beforeunload事件的绑定
    window.removeEventListener('beforeunload', this.saveCurrentPath)
  },
  methods: {
    saveCurrentPath() {
      //当前路由的路径保存到localStorage
      localStorage.setItem('currentRoutePath', this.$route.path)
    }
  },
  mounted() {
    const currentRoutePath = localStorage.getItem('currentRoutePath')
    if (currentRoutePath) {
      this.$router.push(currentRoutePath)
	  //执行后清除localStorage缓存
      localStorage.removeItem('currentRoutePath')
    }
  }
}

el-table合并行的通用方法(附js代码)

vue前端分页功能实现代码(附js代码)

el-table利用:row-style="rowClass"设置指定行变色

一款免费开源效果酷炫​的 Vue / React 大屏数据展示组件库——DataV 

vue项目动态设置background背景色,解决颜色被替换问题

标签: vue刷新页面, vue获取路由, 监听beforeunload事件

上面是“vue在刷新页面后如何保证路由不变”的全面内容,想了解更多关于 vuejs 内容,请继续关注web建站教程。

当前网址:https://m.ipkd.cn/webs_4730.html

声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

es6语法中最常见的9个函数介绍
HTTP协议中常见的请求方法有哪些?GET请求和POST请求之间的主要区别介绍
帝国cms 批量添加栏目 FOR 6.5版本的
el-table解决@cell-mouse-enter和type="selection"同时存在bug
js利用replaceAll()替换所有指定元素