Vue常见的路由返回上一级

最新推荐文章于 2024-06-17 12:48:17 发布
最新推荐文章于 2024-06-17 12:48:17 发布
阅读量2.6w 收藏 43
点赞数 14
分类专栏： Vue 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Rick_and_mode/article/details/108375689
版权

通常在Vue当中，写电商案例，有时候需要返回到上一个页面，在这里我用的方式就是直接回到你写的上个页
其实常见的方法有三种
第一种
this.$router.go(-1)

在这里插入图片描述

这个的意思就是
返回的是上一级，从哪来回哪去

第二种方法
通过：this.$router.back()
来返回上一级

在这里插入图片描述
这个的意思是返回当前点击的上一级

或者就是第三种固定写法

this.$router.push('/xxx')
或者
this.$router.push({name:'xxx'})

分析三种方案
方案一，返回的是上一级，从哪来回哪去。
方案二，返回当前点击的页面
方案三 ，则是可以指定路由，

外下羊.
关注
  • 14
    点赞
  • 踩
  • 43
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue路径返回的正确使用
代码青春
03-11 1001
vue路由跳转 返回上一级 this.$router.go(-1) 和返回到指定页面this.$router.push('/home') 1，点击返回上一页 <button @click="goBack">goback</button> methods:{ goBack: function(){ /** 返回上一级页面用 this.$ro...
vue项目实现前进刷新后退不刷新
07-02
此项目代码包括3种（大同小异的）方式实现页面数据的前进刷新后退不刷新的功能，分别可以参考页面的2、3、4代码的实现，欢迎有问题及时反映
前端 Vue路由返回恢复页面状态的实现方案
最新发布
2401_84619986的博客
06-17 840
在使用 vue 开发前端的时候遇到一个场景：在首页进行一些数据搜索，点击搜索结果进入详情页面，浏览详情页后返回主页。但这时候之前的搜索记录和翻页就消失了，用户体验不好。所以需要在返回后恢复跳转前的页面参数状态。当然如果条件允许，最简单的办法是点击搜索结果使用新页面打开（例如百度那样）。但当前需求是一个完整的vue开发的项目，并不是打开站外地址，而且详情的内容也不多，使用新页面不太合适（性能较差而且容易制造巨量标签页）。优点：刷新不影响；实现简单缺点：参数只能是基础类型、长度受限；路径看起来比较难看；
vue router返回上一级
weixin_58018769的博客
08-11 6651
router.push()方法可以用来跳转到指定的页面，其中可以传入一个字符串参数，表示页面跳转的路径，如果传入'back'，表示返回上一页。window.history.go()方法可以用来跳转到指定的页面，其中可以传入一个参数，表示页面跳转的层级，如果传入-1，表示返回上一页。router.go()方法可以用来跳转到指定的页面，其中可以传入一个参数，表示页面跳转的层级，如果传入-1，表示返回上一页。5.使用window.history.back()方法。2.使用router.back()方法。
vue返回上一页(后退)的几种方法与区别
热门推荐
vvv3171071的博客
11-30 8万+
案例： 从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.$route
Vue中实现回退到上一级目录或者回退到首页
weixin_52890053的博客
04-10 1488
最近在Vue的路由执行一些功能的实现，自己又很菜，所以学习了该方面的知识并在将其分享给大家，期望可以帮到大家，特别适合小白的学习
vue的vue-router中返回上一页的方式
发渐稀的博客
06-29 4443
其中，在开发阶段，方式一用的是最多的，但是需要注意一点，就是其真的是返回到上一页，所以有时候达不到我们想要的效果，这时候就可以借助方式三的编程式导航来解决，无论上一页是什么，点击返回按钮都只会跳转到指定的路由。不过最好在路由信息好久不变的情况下使用。history.go(-1)是返回浏览器的上一页，而由于Vue是单页面应用，有的浏览器对于。编程式导航，点击后返回指定页面，指明返回的页面路径。变更不认为是两个不同的页面，在hash模式下就不会跳回浏览器上一页。
3种vue路由传参的基本模式
12-28
在vue路由中，支持3中传参方式。场景，点击父组件的li元素跳转到子组件中，并携带参数，便于子组件获取对应li的数据，显示相应的正确的内容。父组件中：(article.id)>方案一：getDescribe(id) {// 直接调用$router....
vue监听浏览器原生返回按钮,进行路由转跳操作
10-14
主要介绍了vue监听浏览器原生返回按钮,进行路由转跳操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue+element使用动态加载路由方式实现三级菜单页面显示的操作
10-14
在Vue.js框架中，结合Element UI库，动态加载路由是一种高效的方法来管理复杂的应用程序菜单结构，特别是当涉及到多级菜单时。以下是如何使用这种方式实现三级菜单页面显示的详细步骤和知识点： 首先，动态加载路由...
vue根据进入的路由进行原路返回的方法
12-03
当涉及到非标准的返回逻辑，例如希望用户在点击返回按钮时不是返回上一级页面，而是回到特定的前一级页面，这就需要自定义路由的返回行为。本文将详细解析如何在Vue中实现“根据进入的路由进行原路返回”的方法。 ...
vue element 关闭当前tab 跳转到上一路由操作
10-15
2. **返回上一个路由**：在移除当前视图后，我们可以使用Vue Router的 `go` 方法来回到上一个历史记录的路由。`go(-1)` 表示回退一步。 ```javascript this.$router.go(-1); ``` **方法二** 1. **手动从...
Vue获取（返回）上一个路由
Minyoung 的博客
05-25 2万+
Vue获取上一个路由或者说返回到上一个路由可以用三种方法实现 1.使用钩子函数beforeRouteEnter beforeRouteEnter(to, from, next) {} 以及其他两个钩子函数请看：https://www.cnblogs.com/lhl66/p/9195901.html 关于路由守卫，每个路由是又独立守卫的：https://www.jianshu.com/p/...
vue-router路由跳转
高压锅博客
12-10 1346
1.router.push(location, onComplete?, onAbort?) 这个方法会向 history 栈添加一个新的记录，所以，当用户点击浏览器后退按钮时，则回到之前的 URL。 注意：在 Vue 实例内部，你可以通过 router.push。 当你点击 时，这个方法会在内部调用，所以说，点击 等同于调用 router.push(…)。 声明式 编程式 ...
vue返回上一级
m0_74608954的博客
09-21 157
/ 后退一步记录，等同于 history.back()
VUE中页面跳转的常用方式及返回上一页实现的两种方式
前端-尔嵘
06-25 2万+
一、我们知道，如果是一个页面的某些部分切换变化，那不是网页之间的切换，而是子组件的切换；对于页面切换，我们需要知道的是整个页面的内容和路径都发生了改变。在原生JS中我们知道页面切换可以使用location href的方式。而在VUE中有两种常见的切换方式： 一种是router-link to="路径",问号后面是附加的传输数据，对应的页面也的按名字geohash来取。例如 <route...
vue返回上一页的方式
m0_67021283的博客
02-10 4634
从a页面=>b页面=>c页面，当前在c页面，执行某方法后可以如同按了浏览器后退键一样返回b页面。history.go(-1)是返回浏览器的上一页，而由于Vue是单页面应用，有的浏览器对于。1、若项目使用vue-router ，则使用this.$router.go(-1)。变更不认为是两个不同的页面，在hash模式下就不会跳回浏览器上一页。
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页面返回上一级页面不刷新，数据还在（详情页返回列表页）
沙漠一只雕的博客
07-19 4585
vue页面返回上一级页面不刷新，数据还在（详情页返回列表页）
vue路由返回上一级传参
04-20
你好！非常感谢您的提问。关于vue路由返回上一级传参的问题，可以使用this.$router.back(-1)方法进行返回上一级，并且在上一级组件中使用$route.params获取传递过来的参数。如果需要返回多级，可以使用this.$router.go(-n)方法，其中n为需要返回的级数。希望能够帮到您！
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值