vue返回上一页(后退)的几种方法与区别

案例：

从a页面=>b页面=>c页面，当前在c页面，执行某方法后可以如同按了浏览器后退键一样返回b页面

方法：

①. 若项目使用vue-router，this.$router.go(-1)可以回到上一页

②. this.$router.back()

③. window.history.go(-1)

区别

①与②的区别是：

go(-1): 原页面表单中的内容会丢失：1. this.$router.go(-1)：后退+刷新；2. this.$router.go(0)：刷新；3. this.$router.go(1)：前进；----back(): 原页表表单中的内容会保留；1. this.$router.back()：后退 ；2. this.$router.back(0)：刷新；3. this.$router.back(1)：前进；

③的区别是：

history.go(-1)是返回浏览器的上一页，而由于Vue是单页面应用，有的浏览器对于hash变更不认为是两个不同的页面，在hash模式下就不会跳回浏览器上一页

vue返回上一页(后退)的几种方法与区别相关推荐

vue返回上一页不刷新页面的方法 / vue缓存页面
问题: vue框架下,在返回上一页的时候(this.$router.go(-1)) ,默认会让上个页面重新执行一遍生命周期(即被刷新了). 想达到的效果: 返回上一页不刷新页面. 解决方法: 缓存上一 ...
uniapp返回上一页携带参数,两种方法，实测有效
方法一: pages/pre/pre.vue <template><view><view>返回的数据为:</view><view>id: { ...
vue返回上一页并不刷新
vue返回上一页并不刷新 vue返回上一页并不刷新 1.首先添加在主页面添加keep-alive <keep-alive ><router-view :key="key&q ...
Vue 返回上一页页面不刷新
Vue 返回上一页页面不刷新场景:首页点进列表页时要刷新数据,信息页返回列表页时不刷新数据首先在router.js中配置 {path: '/home',name: 'home',meta: {ti ...
VUE 返回上一页不刷新页面、重复进入同一页面created重复执行、每次进入页面时都执行created、vue单页面多路由，前进刷新，返回不刷新
每次进入页面时都执行created.前进刷新,返回不刷新思路: 利用 keep-alive与vue-router配合使用 ,判断哪些页面需要每次进入刷新,哪些页面不需要每次进入刷新: keepAli ...
解决VUE返回上一页，上一页空白问题
问题: 我做项目的时候发现vue返回上一页的时候, 有时候router不会读取router上的参数,就会导致我的项目空白. 思路: 让返回上一页的时候,上一页能读取到路由参数解决: 根据上下页的n ...
VUE中页面跳转的常用方式及返回上一页实现的两种方式
一.我们知道,如果是一个页面的某些部分切换变化,那不是网页之间的切换,而是子组件的切换:对于页面切换,我们需要知道的是整个页面的内容和路径都发生了改变.在原生JS中我们知道页面切换可以使用locati ...
vue 返回上一页，页面样式错乱
vue项目返回上一页有时候会出现,页面样式错乱,就是页面之间的样式干扰了,虽然vue 是单页面开发,但是并不是说写在哪个页面上就是哪个页面的样式解决方法已知有如下两种给最外层页面添加独立的div ...
vue 返回上一页带参数
返回上一页用的是 this.$router.go(-1) 那么只能在返回之前将参数放在localStorage里面 localStorage.setItem('searchKeyword', this ...
vue返回上一页并传值回上一个页面（uni版本）
1.返回上一页点击按钮及配置参数 backNav() {uni.$emit("planAdd",{tabIndex: 2});uni.navigateBack(); //此地方用的 ...

vue返回上一页(后退)的几种方法与区别

案例：

方法：

区别

vue返回上一页(后退)的几种方法与区别相关推荐

最新文章

热门文章