vue 返回上一页的方式

于 2024-12-05 22:15:00 发布
阅读量501 收藏 1
点赞数 3
CC 4.0 BY-SA版权
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/HDdgut/article/details/144258730

$router.back()

原页表单中内容会保留

$router.back(-1) //后退
$router.back(0) //刷新
$router.back(1) //前进

$router.go()

原页表单中内容会丢失

$router.go(-1) //后退，刷新
$router.go(0) //刷新
$router.go(1) //前进

window.history.go(-1)

返回浏览器的上一页，有的浏览器对于hash的变更，不认为是两个页面，所以在hash模式下，不会跳转上一页

HDdgut
关注
vue返回上一页(后退)的几种方法与区别
seimeii的博客
09-20 1498
vue返回上一页(后退)的几种方法与区别
Vue移动端右滑屏幕返回上一页附源码下载
12-10
本文结合实例讲解如何实现Vue移动端右滑屏幕返回上一页。 查看演示 下载源码 安装依赖 使用npm安装vue-directive-touch组件。 npm install vue-directive-touch --save 引入组件 在main.js中引入vue-directive-...
vue返回上一页的方式
m0_67021283的博客
02-10 4837
从a页面=>b页面=>c页面，当前在c页面，执行某方法后可以如同按了浏览器后退键一样返回b页面。history.go(-1)是返回浏览器的上一页，而由于Vue是单页面应用，有的浏览器对于。1、若项目使用vue-router ，则使用this.$router.go(-1)。变更不认为是两个不同的页面，在hash模式下就不会跳回浏览器上一页。
Vue 3:实现页面返回上一页的功能
weixin_73060959的博客
09-15 3687
在Vue 3中，可以使用Vue Router库来实现页面返回上一页的功能。首先，确保你已经安装并设置了Vue Router。这两个方法都可以使浏览器的历史记录回退一步。来获取Vue Router实例。然后，我们定义了一个。函数会被触发，从而使浏览器返回到上一个访问的页面。在这个例子中，我们使用。
vue返回上一页(后退)的几种方法与区别_vue返回上一级页面
最新发布
2401_87555637的博客
11-11 1855
从a页面=>b页面=>c页面，当前在c页面，执行某方法后可以如同按了浏览器后退键一样返回b页面。
vue router返回上一级
weixin_58018769的博客
08-11 7955
router.push()方法可以用来跳转到指定的页面，其中可以传入一个字符串参数，表示页面跳转的路径，如果传入'back'，表示返回上一页。window.history.go()方法可以用来跳转到指定的页面，其中可以传入一个参数，表示页面跳转的层级，如果传入-1，表示返回上一页。router.go()方法可以用来跳转到指定的页面，其中可以传入一个参数，表示页面跳转的层级，如果传入-1，表示返回上一页。5.使用window.history.back()方法。2.使用router.back()方法。
vue 返回上一页,页面样式错乱的解决
10-15
总结一下，Vue项目中返回上一页页面样式错乱的解决方法主要包括：为组件外层添加特定的class或id进行样式区分，合理利用CSS预处理器的模块化功能，使用Vue的作用域样式和插槽，以及全局设置样式的正确方式。...
Vue生命周期activated之返回上一页不重新请求数据操作
10-15
Vue生命周期中的`activated`函数是在组件被`keep-alive`组件缓存后，当组件再次被激活（例如从其他页面返回）时调用的。在实际开发中，它常用于处理页面返回时需要保持的数据或者状态，以避免重复请求数据。 在描述...
vue返回上一页面时回到原先滚动的位置的方法
01-21
项目结束，测试时发现在首页商品列表中，向上滑动几页后点击进入详情，从详情页面返回商品列表时，页面回到了最顶部，测试不通过说是用户体验不好，要求从哪里点击进去返回该页面时回到原先的滚动页面。 思路：因为...
vue，返回上一页面
qq_35907133的博客
05-07 489
页面中写的 执行的方法 step() { // 这个判断用来解决这种情况，当用户没有上一条路由的历史记录，出现点击返回按钮没有反应时，下面的代码用来判断有没有上一条路由的历史记录 如果没有则返回首页 if (window.history.length <= 1) { this.$router.push({ path: "/home" }); return false; } else { this.$route...
vue 返回上个页面
最初都是小白
12-28 3014
返回上一页： this.$router.go(-1);//返回上一层
用Vue实现点击返回上一个页面
weixin_46419373的博客
05-13 7069
通常在Vue当中，写电商案例，有时候需要返回到上一个页面，在这里我用的方式就是直接回到你写的上个页面 1、通过：this.$router.go(-1) 2、通过：this.$router.back()
vue 返回上一页&跳转到其他页面
weixin_48702807的博客
09-30 637
返回上一页 this.$router.back(); this.$router.go(-1); 跳转到其他页 this.$router.push('/home'); // html5 的 history 模式： pushState this.$router.replace('/home'); //返回不了上一页
vue路由返回上一页操作
业余前端的职业经历
02-18 3212
有些时候我们从其他的页面跳转到登录页面我们登陆之后然后想调回原来的页面就是使用vue的路由返回的操作 this.$router.go(-1) //返回上级操作 或者直接在返回方法上写 @click="$router.go(-1)" ...
Vue 路由 跳转【返回、刷新、跳转】
热门推荐
estrusKing的博客
03-23 1万+
Vue 路由 跳转【返回、刷新、跳转】this.$router.go(-1)this.$router.back()this.$router.pushthis.$router.replace this.$router.go(-1) 原页面表单中的内容会丢失； 向前或者向后跳转n个页面，n可为正整数或负整数 this.$router.go(-1)：后退+刷新 this.$router.go(0)：刷新； this.$router.go(1) ：前进 this.$router.back() 原页表表单中的内
Vue返回，跳转上一页命令
The limits of your knowledge are the limits of your world
05-08 3530
返回上一页 this.$router.go(-1) 返回上一页，否则跳转指定页面 if (window.history.length <= 1) { this.$router.push({path:'/'}) return false } else { this.$rou...
前端 Vue路由返回恢复页面状态的实现方案
2401_84619986的博客
06-17 1274
在使用 vue 开发前端的时候遇到一个场景：在首页进行一些数据搜索，点击搜索结果进入详情页面，浏览详情页后返回主页。但这时候之前的搜索记录和翻页就消失了，用户体验不好。所以需要在返回后恢复跳转前的页面参数状态。当然如果条件允许，最简单的办法是点击搜索结果使用新页面打开（例如百度那样）。但当前需求是一个完整的vue开发的项目，并不是打开站外地址，而且详情的内容也不多，使用新页面不太合适（性能较差而且容易制造巨量标签页）。优点：刷新不影响；实现简单缺点：参数只能是基础类型、长度受限；路径看起来比较难看；
vue 返回上一页面
09-14
在Vue中返回上一页有多种方式，下面列举了其中几种常见的方法： 1. 使用 `router.go()` 方法：可以通过 `router.go(-1)` 来返回上一页。这个方法会在浏览器的历史记录中回退一步。 ```javascript // 在组件中调用 this.$router.go(-1); ``` 2. 使用 `router.back()` 方法：与 `router.go(-1)` 类似，也是返回上一页。 ```javascript // 在组件中调用 this.$router.back(); ``` 3. 使用 `router.push()` 方法：如果你想要通过路由跳转到上一页，可以使用 `router.push()` 方法，并指定目标页面的路径。 ```javascript // 在组件中调用 this.$router.push('/previous-page'); ``` 这里的 `/previous-page` 是你要返回的上一页的路径。 需要注意的是，以上方法都需要确保你已经正确地配置了Vue Router，并且在组件中可以访问到 `$router` 对象。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值