VUE面刷新
1.这种方法页面会一瞬间的白屏
this.$router.go()
2.这种也是一样,画面一闪
location.reload()
3.搭配provide、inject使用
首先在主页面 app.vue
设置:
<keep-alive include="GjTable">
<router-view v-if="isRouterAlive"></router-view
></keep-alive>
设置:script
export default {
provide () {
return {
reload: this.reload
},
data () {
return {
isRouterAlive: true
}
},
methods: {
reload () {
this.isRouterAlive = false
this.$nextTick(function () {
this.isRouterAlive = true
})
}
}
}
在需要刷新的页面导入
inject: ['reload'],
调用刷新:
// 此页面加了缓存需要重新加载数据
this.getgjtype('vue')
this.reload() // 刷新页面
VUE面刷新的更多相关文章
- URL不变的情况下,最实用的vue刷新当前页面,provide / inject 组合 方式实现vue页面刷新
原文:https://blog.csdn.net/Dream_xun/article/details/83024487 其他参考:https://blog.csdn.net/liyunkun888/a ...
- vue项目刷新页面,使数据不丢失(sessionStorage、localStorage、cookie)
vue项目刷新页面时,存储在vuex中的数据会丢失,把他们存到stroage中可以保证不丢失.
- Vue. 之 刷新当前页面,重载页面数据
Vue. 之 刷新当前页面,重载页面数据 如下截图,点击左侧不同的数据,右侧根据左侧的KEY动态加载数据.由于右侧是同一个页面,在进行路由跳转后,不会再次刷新数据. 解决方案: 右侧的页面中 scri ...
- 玩转vue前进刷新,后退不刷新and按需刷新
大白萝卜小课堂开讲了!带你玩转vue前进后退按需刷新! 用vue做后台管理项目,特别是有列表页.列表数据详情页.列表数据修改页功能的码友们,几乎都被vue前进后退都刷新的逻辑坑过,本萝卜更是! 萝卜的 ...
- VUE页面刷新问题
1). location方式 location.reload() 缺点:刷新页面,卡白 2). router方式 this.$router.go(0) 缺点:同一问题,比一好点 3). provide ...
- Vue实现刷新当前路由
Vue点击当前路由实现刷新 Vue点击当前路由实现刷新思路Code实现效果 前言:在后台管理系统中,有这样一个需求点击当前菜单栏时,页面依旧可以刷新. 点击当前路由实现数据请求页面刷新 思路 点击当前 ...
- VUE 项目刷新路由指向index.html
背景描述: VUE 项目经过 npm run bulid 生成静态文件上传到服务器后,当我们切换路由并刷新页面,nginx 服务器会报 502 或者 404 错误. 原因分析: 我猜测是因为在 VUE ...
- Vue.js刷新当前页面
Vue.js的路由跳转很强大,类似ajax的局部刷新,路由跳转时候页面是不刷新的,刷新当前页面的功能不建议用,但是有的时候确实需要刷新当前页面来实现某些需求,这个时候,我们有三 种方法可以实现. 第一 ...
- vue项目刷新当前页面
场景: 有时候我们在vue项目页面做了一些操作,需要刷新一下页面. 解决的办法及遇到的问题: this.$router.go(0).这种方法虽然代码很少,只有一行,但是体验很差.页面会一瞬间的白屏,体 ...
随机推荐
- redo log重做日志缓冲
---------------------------------- 2015-02-10---------------------------------- innodb redo log (重做日 ...
- python基础-面向对象编程之反射
面向对象编程之反射 反射 定义:通过字符串对对象的属性和方法进行操作. 反射有4个方法,都是python内置的,分别是: hasattr(obj,name:str) 通过"字符串" ...
- Python 爬虫之 Beautifulsoup4,爬网站图片
安装: pip3 install beautifulsoup4 pip install beautifulsoup4 Beautifulsoup4 解析器使用 lxml,原因为,解析速度快,容错能力强 ...
- js数据类型详解
一.js数据类型分类 (1)原始数据类型(值类型) null 空类型,变量声明了并赋值为null.转化为数字是0 undefined 未定义,变量声明了但未赋值.转化为数字为NaN boolean 布 ...
- openstack Train 版本dashaboard 404问题
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明本文链接:https://blog.csdn.net/weixin_28738845/articl ...
- LearnOpenGL.PBR.工作流贴图
- 笔记6:Django基础
Django-MVT (1)查看python版本号: python -m django --version (2) 创建Django项目 django-admin startproject mysit ...
- Windows下使用mingw+cmake编译C/C++程序
按照正常流程安装好mingw和cmake后,仍然是无法直接使用cmake编译处MakeFile文件的,我们需要在CMakeLists.txt中做一些配置. 首先,在PROJECT之前,设置: SET( ...
- 201871010123-吴丽丽 《面向对象程序设计(Java)》第八周学习总结
201871010123-吴丽丽<面向对象程序设计(Java)>第八周学习总结 项目 内容 这个作业属于哪个课程 http://www.cnblogs.com/nwnu-daizh/ ...
- 201871010134-周英杰《面想对象程序设计(java)》第十一周学习总结
项目 内容 <面向对象程序设计(java)> https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.com/ ...