vue刷新当前页面的方法

当使用this.$router.push()尝试刷新Vue页面时,可能会遇到错误且DOM不渲染。本文探讨了不推荐的location.reload()方法及其导致的瞬间空白问题,然后介绍了使用provide/inject来实现在当前页面刷新的同时保持组件状态,并利用Vue的nextTick确保DOM更新后的操作。通过这些方法,可以解决页面刷新和组件重渲染的问题。
摘要由CSDN通过智能技术生成
第一个想到的方法是this.$router.push() , 但是会报错 , 不让自己页面跳转自己页面 , 就算解决了这个问题跳转了之后 , dom也不会渲染 , 页面的数据显示不出来 , 所以查询了一下方法来解决问题

location.reload() 不推荐 : 页面出现一瞬间的空白

  1. 这个方法相当于( ctrl + R )刷新当前页面 , 但是刷新过后vuex里面的值也会重新刷新 , 当我们要实现多个组件根据 vuex 里面的值做相应的判断时 , 这个功能不能实现 , 于是我们结合window.sessionStorage.getItem() 和 vuex以实现vuex中的值在本次会话的时候不会被刷新
//freeze状态只出现一次 , 解封之后知道浏览器关闭都不在出现
this.$store.commit('changeFreeze')
//  1. dom没有渲染 , 我们要重新渲染dom 
location.reload()//这种刷新方式太耗能了,亟待优化
//  2. 强制刷新之后freeze还会出现-->把值保存在session中
window.sessionStorage.setItem('freeze',0)


以下是vuex中的
freeze
  • 1
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值