vue刷新当前页面,不留白
用provide / inject 组合
原理:允许一个祖先组件向其所有子孙后代注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效
在App.vue,声明reload方法,控制router-view的显示或隐藏,从而控制页面的再次加载。
<template><div id="app"><router-view v-if="isRouterAlive"></router-view></div>
</template><script>
export default {name: 'App',provide () {return {reload: this.reload}},data () {return {isRouterAlive: true}},methods: {reload () {this.isRouterAlive = falsethis.$nextTick(function () {this.isRouterAlive = true})}}
}
</script>
在需要用到刷新的页面。在页面注入App.vue组件提供(provide)的 reload 依赖,在逻辑完成之后(删除或添加…),直接this.reload()调用,即可刷新当前页面。
注入reload方法
export default {name:"header",inject:['reload'], //重点!!!!data(){return{}}
}
调用:
this.reload()
vue刷新当前页面,不留白相关推荐
- 最实用的vue刷新当前页面,provide / inject 组合 方式实现vue页面刷新
这是一种最实用的vue刷新当前页面,其他方式一般会出现一个瞬间的空白页面,体验不好,相当于按ctrl+F5 强制刷新那种 方式:provide / inject 组合 方式实现vue页面刷新 1.修改 ...
- Vue刷新当前页面几种方式
问题: 最近些日子项目中突然碰到了一个需求,再完成编辑操作之后需要进行页面刷新,通过实验有如下几种姿势可以解决需求中的问题,下面进行简单总结如下. 姿势一:this.$router.go(0) 这个姿 ...
- vue 刷新当前页面、组件;provide、inject
provide.inject 最外层组件(祖先组件)向其所有子组件注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效:通过在App.vue,声明reload方法,控制router- ...
- vue 刷新当前页面
1.首先在app.vue页面加入以下代码: 2.在需要刷新的页面 .
- vue刷新当前页面--provide / inject 用法
window.reload()/router.go(0): 采用window.reload(),或者router.go(0)刷新时,整个浏览器重新加载,闪烁.严重影响体验 provide / inje ...
- Vue刷新当前页面(成功)
查了资料一共有三种办法,只试过两种,都成功了,介绍一下. 一.直接路由刷新 vue自带了刷新的办法 this.$router.go(0); 但是这个办法会让整个当前页面刷新,相当于F5.如果项目中只是 ...
- Vue刷新组件,页面刷新
通过:provide / inject 方式实现! Home.vue <keep-alive :include="tagsList" v-if="showView& ...
- 解决:vue项目的页面刷新之 title被重置问题
如何解决:vue项目的页面刷新之 title被重置问题? 需求场景描述:(以title名为"个人中心"页面为例) 用户初次访问进入"个人中心"页,浏览器显示的页 ...
- vue切换菜单时不需要页面刷新_antd vue 刷新保留当前页面路由,保留选中菜单,保留menu选中操作...
废话不说,上代码! nav 1 nav 2 nav 3 重点: 1,selectedkeys要设置成$route.path地址 2,a-menu-item 的key设置成要去的地址 刷新页面,成功! ...
最新文章
- wordpress自适应表格_给WordPress添加自适应表格 让表格自适应屏幕
- Spark配置高可用(HA)
- netstat获取本机监听的地址列表 —— *链表实现*(sudo netstat -nl | grep -w tcp | awk '{print $4}')
- 【Linux】一步一步学Linux——route命令(169)
- MySQL等值连接的示例
- Android DatePicker, TimePicker控件的使用
- java动态网站框架_大型网站动态应用系统架构
- 从头开始学eShopOnContainers——Visual Studio 2017环境配置
- 汽车熄火是什么原因?
- 每天进步一点点《ML - 正则化代价函数》
- c#向MFC窗体发送消息
- crash分析中有用的管道命令
- Android Message和obtainMessage的区别
- CocosCreator之场景编辑器介绍
- Lync 2013安装要点
- 计算机f2锁定用户,台式电脑键盘被锁住按什么键恢复 点锁定直接锁定计算机
- 高中英语语法(005)-五大句型(下)
- 以太坊区块链积分系统示例讲解
- 知识付费网站源码可开分站一键更新后台数据
- Java的运算符-取整,取绝对值,取余数