vue-router的$route.replace使用及未生效原因

最新推荐文章于 2024-04-28 13:49:25 发布
最新推荐文章于 2024-04-28 13:49:25 发布
阅读量1.1w 收藏 4
点赞数 1
分类专栏： vue router
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_48802738/article/details/111630529
版权
vue 同时被 2 个专栏收录
11 篇文章 0 订阅
订阅专栏
router
1 篇文章 0 订阅
订阅专栏

replace 与push的区别在于,replace的跳转的页面不会被记录路由记录中,在使用$route.go(),更方便!

在使用replace未生效的原因:
(1) replace是作用在本页的路由的

(例如从home页跳转到index页,使用了$route.replace(’/index’),那么home页将不会记录在路由历史中!!!)

可爱滴菜鸟
关注
  • 1
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue 使用this.$router.replace、this.$router.go、this.$router.push 等进行页面跳转不生效
絮落锦乡的博客
03-27 8410
一、问题描述 vue 在使用页面跳转的时候，发现页面总是不调转，或者地址变了，页面不刷新等问题 二、解决方案 1、排查页面是否使用了beforeRouteLeave ，如果使用了该函数，意味着路由被拦截下来进行处理了，这个时候做完逻辑处理后必须要加上 next() 函数，才能让路由继续跳转，否则页面将不会跳转。 2、排查页面是否报错，哪个方法未定义。 3、检查路由配置是否正常。 ...
$router.replace移动端不生效_UE4移动端Reflection Capture反射清晰度提升
weixin_33314238的博客
01-15 478
我们在做玻璃，或者光滑金属，或者基于cubemap的室内等等效果的时候，往往需要较清楚的环境反射，但在UE4的移动端中，使用廉价的Relfection Capture却得不到清晰的反射结果。这篇文章讲的是如何改进UE4实现，以提升Reflection Capture做为镜面反射时的清晰度。在《UE4 Mobile IBL烘焙实现分析》中有简单介绍过移动端Reflection Capture数据存储...
关于vue3.0中的this.$router.replace({ path: '/'})刷新无效果问题
10-15
主要介绍了关于vue3.0中的this.$router.replace({ path: '/'})刷新无效果问题，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Vue Router中的replace与路由守卫
最新发布
yxh_live的博客
04-28 984
Vue Router中的replace与路由守卫
使用this.$router.repalce()/this.$router.push()/this.$router.go(n)跳转列表页，页面无刷新解决方法
weixin_47389477的博客
04-05 1948
前言 前两天做了个新增页面（之前都是用弹窗实现新增数据功能，现在使用路由跳转新增界面），但是出现一个问题，我新增内容通过接口，新增成功并返回列表页，但是列表页页面没有刷新（因此：在跳转相同组件不会触发vue的视图更新。） 尝试方法一（不可行） 使用一个中间页面作为媒介，（原本由A（新增页）页面跳转B（列表页）页面，现在加个C（媒介页）页面，新的跳转是由A到C再到B）发现这样并不能使页面刷新，因为首先看到的是列表页，点击A中的新增按钮显示B，点击B返回A时，路由里面应该是由路由history记录，发现路由没变
关于vue3.0中的this.$router.replace({ path: ‘/’})刷新无效果问题
11-21
首先在store中定义所需要的变量可以进行初始化，再定义一个方法，登录成功后A页面，跳转到B页面之前，需要直接调用store中存储数据的方法，全局可以使用 诸如以上所示，该问题，百度了好久，多亏群里大佬。 vue使用less报错的解决方法 安装less less-loader cnpm install less less-loader --save-dev app.vue是所有XXX.vue文件的根文件 所以webapp,的底部通常是在这里配置 h5的新增 标题 主题内容 固定的底部内容
【vue】this.$router.replace跳转不起作用 Router push or replace not working
weixin_45650440的博客
03-11 6824
项目场景： 商城APP底部导航切换对应页面 问题描述 提示：这里描述项目中遇到的问题： Just sit there clicking the home btn watching log show me /home but never getting there… export default { name: 'TabBarItem', props: { path: String }, } methods: { itemClick () {
fiddler弱网测试_移动端质量体系之弱网测试
weixin_39525243的博客
11-30 164
最近面试了不少同学，在答移动端质量体系时，都会说到兼容性测试、功能测试等等，但是几乎没有同学会提起弱网测试。其实弱网测试作为健壮性测试的重要部分，对于移动端测试来说必不可少。这是因为目前移动端产品的使用用户所处的网络并非完全的流畅WIFI环境，仍有相当多的用户主要使用4G、3G、2G等网络，另外因移动端产品使用场景多变，如进地铁、上公交、进电梯等，使得弱网测试显得尤为重要。毕竟考虑到各种场景的客户...
搜索引擎收录查询工具_百度站长平台及百度统计工具对SEO优化有什么作用？
weixin_39534321的博客
11-22 261
百度站长平台在优化网站的时候有重要的作用，它可以提供搜索引擎抓取收录的提交和分析工具以及seo优化的建议等。百度站长平台是全球最大的面向中文互联网管理者、移动开发者、创业者的搜索流量管理的官方平台。通过线上线下多种互动渠道，为互联网多端载体增加用户和流量的同时，也为用户创造更加良好的搜索体验。 百度站长平台提供给站长的功能有：网站提交、死链接查询、索引量查询、搜索关键词、外链分析、抓取异常、rob...
vue-router.min.js
07-25
vue-router.min.js
vue-router-3.0.1.js
12-02
vue路由器插件 。
vue3.x+vite+ts+vue-router@4.x 路由使用demo
07-24
通过这个示例项目，你可以了解到如何在 Vue3.x、Vite 和 TypeScript 的环境中设置和使用 Vue Router 4.x，这将对你的前端开发技能有极大的提升。同时，实践项目也能帮助你更好地理解和掌握这些技术的实战应用。
vue项目使用$router.go(-1)返回时刷新原来的界面操作
10-15
主要介绍了vue项目使用$router.go(-1)返回时刷新原来的界面操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Vue路由对象属性 .meta $route.matched详解
12-13
$route.fullPath 1 路由是：/path/:type...const router = new VueRouter({ routes: [ { path: '/foo', component: Foo, children: [ { path: 'bar', component: Bar, // a meta field meta: { requiresAu
vue、uniapp通过hbuilder打包成app后页面跳转无效，this.$Router不起作用。解决方案
wwppp987的博客
02-18 5543
this.$Router.push() uniapp 打包成app后发现跳转页面无效 this.$Router.replace() 也是 原因： 部分apk和ipa不支持history模式。 解决办法： 搜索 new Router关键词： 【一般是在】router/index.js当中， 将mode更改为'hash' 解析： 由于平时调整网页，我们习惯使用history模式调整，因为在hash模式的url当中会产生#号。 所以将 ...
Router跳转到Vue页面onMounted事件不执行？
laoqiming的专栏
02-20 8861
为什么我这个项目的Vue页面，onMounted事件只执行一次？使用router跳转回来的时候就不会执行了，我记得在其另外一个项目是每次都执行的。
vue-router中replace当前路由报错
qq_25346499的博客
10-14 2049
问题 在做vue项目时，发现replace到当前路由path时会报错，然后在百度上找了挺久，发现了一个可行的解决方法。 解决方法 在main.js中添加如下代码即可 const originalPush = router.replace; router.replace = function replace(location) { return originalPush.call(this, location).catch(err => err) }; ...
$router、$route、$router.push()和、$router.replace()
热门推荐
weixin_38599724的博客
11-14 2万+
1.this.$router是VueRouter的一个对象，表示全局路由器对象，项目中通过router路由参数注入路由之后，在任何一个页面都可以通过此方法获取到路由器对象，并调用其push(), go()等方法； 2.this.$router表示当前正在用于跳转的路由器对象，可以调用其name、path、query、params等方法； 3.console.log(this.$router)和...
vue-router中router.replace和router.push有什么不同
05-27
在Vue.js应用程序中，Vue-Router是一个非常流行的路由管理库。Vue-Router提供了两种导航路由的方式：router.push()和router.replace()。 router.push()会向history栈中添加一个新的记录，当用户点击浏览器后退按钮时，会回到前一个页面。而router.replace()也会向history栈中添加一个新的记录，但是它不会增加新的历史记录，而是替换当前的历史记录，所以当用户点击浏览器后退按钮时，不会回到前一个页面，而是直接回到上上个页面。 举个例子：假设我们从页面A跳转到页面B，如果使用router.push()，那么浏览器的历史栈中会增加一个记录，当用户点击后退按钮时会回到页面A；如果使用router.replace()，那么页面B会替换掉页面A在历史栈中的记录，当用户点击后退按钮时会直接回到上一个页面（可能是其他页面，而不是页面A）。 因此，router.push()和router.replace()的主要区别在于是否在history栈中增加新的记录。如果希望用户可以回到前一个页面，则应该使用router.push()；如果不希望用户回到前一个页面，则应该使用router.replace()。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值