Vue.js刷新当前页面
Vue.js的路由跳转很强大,类似ajax的局部刷新,路由跳转时候页面是不刷新的,刷新当前页面的功能不建议用,但是有的时候确实需要刷新当前页面来实现某些需求,这个时候,我们有三 种方法可以实现。
第一种就是传统的的方法
window.location.reload();
第二种是通过vue.js的路由来实现
this.$router.go(0)
<template>
<section>
<h1 ref="hello">{{ value }}</h1>
<el-button type="danger" @click="get">点击</el-button>
</section>
</template>
<script>
export default {
data() {
return {
value: 'Hello World ~'
};
},
methods: {
get() {
this.$router.go(0);
// window.location.reload();
}
},
mounted() {
},
created() {
}
}
</script>
第三种是使用浏览器自带的刷新功能,window.history.go(0),这里的window可以省略不写
history.go(0);
<template>
<section class="p-10">
<el-button type="danger" @click="back">返回</el-button>
</section>
</template>
<script>
export default {
data() {
return {
};
},
methods: {
back() {
history.go(0);
}
}
};
</script>
既然使用vue来做前端了,那么这里就推荐使用第二种方式吧~
嗯,就酱~~
Vue.js刷新当前页面的更多相关文章
- Vue. 之 刷新当前页面,重载页面数据
Vue. 之 刷新当前页面,重载页面数据 如下截图,点击左侧不同的数据,右侧根据左侧的KEY动态加载数据.由于右侧是同一个页面,在进行路由跳转后,不会再次刷新数据. 解决方案: 右侧的页面中 scri ...
- vue案例 - vuex+sessionstorage解决vue项目刷新后页面空白/数据丢失
第一部分 SessionStorage 首先查看sessionStorage的地方在控制台的 Application > Storage > Session Storage这里: 根据se ...
- vue项目刷新当前页面
场景: 有时候我们在vue项目页面做了一些操作,需要刷新一下页面. 解决的办法及遇到的问题: this.$router.go(0).这种方法虽然代码很少,只有一行,但是体验很差.页面会一瞬间的白屏,体 ...
- (转)vue项目刷新当前页面
场景: 有时候我们在vue项目页面做了一些操作,需要刷新一下页面. 解决的办法及遇到的问题: this.$router.go(0).这种方法虽然代码很少,只有一行,但是体验很差.页面会一瞬间的白屏,体 ...
- js 刷新父页面
//刷新父页面 window.opener.location.reload();
- vue.js在html页面中的使用
1.加载vue.js,然后 var app = new Vue({ //vue代码})2.截图如下:
- Vue.js如何在一个页面调用另一个同级页面的方法
使用场景: 页面分为header.home.footer三部分,需要在home中调用header中的方法,这两个没有相互引入 官方给出方法: 需要在展示页里调用顶部导航栏页里的方法,两者之间没有引用关 ...
- js 刷新当前页面会弹出提示框怎样将这个提示框去掉
//禁止刷新提示window.onbeforeunload = function() { var n = window.event.screenX - window.screenLeft; var b ...
- js刷新当前页面
a href="javascript:window.location.href=location.href"
随机推荐
- Atitit.得到网络邻居列表java php c#.net python
Atitit.得到网络邻居列表java php c#.net python 1. 获取workgroup net view /domain1 2. 得到网络邻居列表1 3. 得到机器的ip 通过p ...
- Aurora学习笔记连载一:仿真平台搭建
由于公司项目需要,需要学习Aurora协议,才有了这样的连载学习笔记,也算是对自己学习的一份记录吧. 对于Aurora是什么,大家自行百度. 当然,Kevin也在此先提醒大家,本套学习笔记不是你想学就 ...
- SpringMVC请求使用@PathVariable获取文件名称并且文件名中存在.导致路径被截取的问题
在SpringMVC中,当使用@pathVariable通过Get请求获取路径名称时,如果路径名称上存在小数点,则获取不到小数点后面的内容,会被Spring截取. 比如我获取某一文件,路径是local ...
- linux命令-进阶1
Linux查看系统信息的一些命令及查看已安装软件包的命令 centos下如何查看某个软件是否安装http://www.landui.com/help/show-3959.html CentOS 下 r ...
- abp主机用户不过滤租户id
using (_unitOfWorkManager.Current.DisableFilter(DataFilterUtil.NowDisableFilter(AbpSession))) { var ...
- LeetCode406. Queue Reconstruction by Height Add to List
Description Suppose you have a random list of people standing in a queue. Each person is described b ...
- UVa 12563 劲歌金曲 刘汝佳第二版例题9-5;
Problem J Jin Ge Jin Qu [h]ao (If you smiled when you see the title, this problem is for you ^_^) Fo ...
- UML结构体系简介
一.UML的结构 UML有3种基本的构造块,分别是事物(元素).关系和图.事物是UML中重要的组成部分.关系把事物紧密联系在一起.图是很多有相互相关的事物的组. 二.UML的事物 UML中的事物也称为 ...
- Power Network - poj 1459 (最大流 Edmonds-Karp算法)
Time Limit: 2000MS Memory Limit: 32768K Total Submissions: 24788 Accepted: 12922 Description A ...
- Linux 文件管理(系统函数)
//read函数 #include <stdio.h> #include <stdlib.h> #include <unistd.h> /* STDIN_FILEN ...