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).这种方法虽然代码很少,只有一行,但是体验很差.页面会一瞬间的白屏,体 ...
随机推荐
- odoo10学习笔记十二:web controller
转载请注明原文地址:https://www.cnblogs.com/ygj0930/p/11189332.html 一:路由 odoo.http.route(route=None, **kw) 装饰器 ...
- [TCP/IP]TCP服务端accept发生在三次握手的哪一个阶段
TCP服务端accept发生在三次握手之后 客户端socket()==>connect()==>write()==>read()服务端socket()==>bind()==&g ...
- 阅读高翔的RGBD-SLAM博文笔记
目录 高翔的RGBD-SLAM笔记 前端VO: 后端优化 高翔的RGBD-SLAM笔记 RGBD相机的特点: 使用RGBD相机中的深度这一维信息,以及相机的针孔成像模型,相机的内参,可以将二维点恢复成 ...
- Ansible 自动化运维工具
Ansible 自动化运维工具 Ansible是什么? Ansible是一个"配置管理工具"也是一个"自动化运维工具" Ansible 作用: Ansible是 ...
- django学习-数据库配置-创建模型
数据库配置 在mysite/settings.py中,包含了django项目设置的python模块 通常,这个配置文件使用SQLite作为默认数据库.如果你不熟悉数据库,或者只是想尝试下django, ...
- webpy安装
C:\Users\ceshi>python -m pip install web.pyCollecting web.py Downloading web.py-0.38.tar.gz (91kB ...
- LG2530 「SHOI2001」化工厂装箱员 高维DP+记忆化搜索
问题描述 LG2530 题解 设\(opt[i][a][b][c][d]\)代表装到第\(i\)个后,第\(1,2,3\)手上分别还剩\(a,b,c\)个的最小操作数. 记忆化搜索即可. 启示:如果状 ...
- python cookbook3
1.算GC含量 def validate_base_sequence(base_sequence, RNAflag = False): #判断序列是否只含有A.T.G.C.U seq = base_s ...
- MySQL学习笔记2————基础篇记录
这里以实验楼的数据库来记录,如有侵犯实验楼权益,请联系本人,必定删除 在此感谢实验楼提供的免费教程 MySQL 基础课程_SQL - 实验楼 一. 表project employee 任务:想要知道名 ...
- [转载]3.12 UiPath存在元素Element Exists的介绍和使用
一.Element Exists的介绍 使您能够验证UI元素是否存在,即使它不可见,输出的是一个布尔值 二.Element Exists在UiPath中的使用 1.打开设计器,在设计库中新建一个Seq ...