解决vue-route路由跳转同一页面时数据不会更新问题

最新推荐文章于 2022-06-08 15:46:54 发布

喵喵超能睡

最新推荐文章于 2022-06-08 15:46:54 发布

阅读量1.6k

点赞数 2

分类专栏： vue 文章标签： vue-route 路由同一路由

本文链接：https://blog.csdn.net/dancer_mm/article/details/101544787

版权

vue 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

解决vue-route路由跳转同一页面时数据不会更新问题

1.问题描述

比如从www.shm.com/album/info/511跳转到www.shm.com/album/info/512页面时，数据不更新

2.解决办法

，只需在watch中监听$route的变化即可

watch: {
    $route(to, from) {
      //将mounted中的数据在这里重新加载一下即可
    }
  },

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

喵喵超能睡

关注关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
3
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

vue-route路由详解

温暖前端的博客

01-18

2211

配置路由格式：/router/:id传递方式：在path后面跟上对应的值传递后形成的路径:/router/1;

解决vue-router进行build无法正常显示路由页面的问题

11-27

此外，更新信息中提到了一个问题，即在进行路由跳转时不应直接使用`window.location.href`，而应使用Vue Router提供的`router.push`方法。这是因为`router.push`会触发Vue Router的导航守卫和其他相关功能，确保应用...

3 条评论您还未登录，请先登录后发表或查看评论

vue-route路由跳转同一页面时数据不会更新

Vamkit

11-27

336

vue-route路由跳转同一页面时数据不会更新 1.问题描述比如从www.shm.com/album/info/511跳转到www.shm.com/album/info/512页面时，数据不更新 2.解决办法只需在watch中监听$route的变化即可 watch: { $route(to, from) { //将mounted中的数据在这里重新加载一下即可 } }, ...

vue 跳转同一路由,页面不刷新解决方案

weixin_51063441的博客

10-15

209

假如切换大类，这些大类下都有这个 -用户管理 -页面，功能一致，但是数据不一致，要重新请求，这个时候我们就要处理了，因为路由没变，页面是不会重载的，我在网上看到别人的一个文章，比较不错，懒得写了，直接分享出来链接吧 https://blog.csdn.net/qq_35897953/article/details/107906851 ...

vue-router重写addRoutes，优雅的解决修改vue路由不更新的问题

hunt_er的博客

03-03

3398

最近在写项目，实现动态菜单及细粒化按钮权限功能，依托于vue-router动态路由的实现，可以实时从后端获取路由权限，并及时更新。动态路由的实现可以看这篇完整文章：vue实现动态路由。问题：在使用addRoutes方法更新路由表的时候，发现从后端带来的权限信息并没有更新掉原有的路由信息。思路：查看vue-router文档，发现addRoutes已经不被推荐使用了，后来使用新的addRoute方法来逐个更新路由，发现并不能解决问题。api也没有提供remove路由的操作。嗯~ 开始面向

解决vue-route路由query不同参数跳转同一页面时数据不会更新问题

大胆刁民的博客

06-08

2372

解决vue-route路由query不同参数跳转同一页面时数据不会更新问题演示

vue 路由跳转页面数据不更新问题

weixin_43045869的博客

04-29

8672

由于 router-view 使用了 keep-alive组件，被缓存了。原因：vue-router的切换不同于传统的页面切换，而是路由之间的切换，其实就是组件之间的切换，引用相同组件的时候，会直接调用缓存而不会调用created()，mounted()函数。解决方法: 第一种：在watch中监听路由变化，对router进行监控，当router发生变化时，执行初始化界面方法 //监听函数 watch: { '$route' () { this.initData();//我的初始化方

解决VUE-Router 同一页面第二次进入不刷新的问题

11-20

当遇到“同一页面第二次进入不刷新的问题”时，通常意味着页面没有正确地响应数据更新而重新渲染。以下是一些解决方案： 1. **添加动态参数**：你可以通过在路由路径中添加一个动态参数（如`:randKey`）来确保...

解决vue+router路由跳转不起作用的一项原因

11-20

在这个问题中，我们将深入探讨为什么在某些情况下，`vue-router`的路由跳转可能不起作用，以及如何通过设置`mode: 'history'`和配置服务器来解决这个问题。首先，Vue Router有两种工作模式：`hash`模式和`history`...

vue3.x:route路径相同参数不同页面不刷新解决

02-17

1873

<router-view :key="route.fullPath"></router-view JS中 import { useRouter, useRoute } from 'vue-router' const router = useRouter() const route = useRoute()

解决Vue同路由跳转后数据不更新

qq1014156094的博客

03-03

2996

场景：需要根据不同的 $route.query 请求不同的数据问题：由于使用 VueRouter 跳转时组件实例会被复用，跳转后无法拿到最新的 $route.query，并且地址栏的 url 不会变化解决方法1 此方法一劳永逸，但是页面渲染速度会降低指定页面 &amp;lt;!-- :key=&quot;$route.fullPath&quot; 解决同路由但不同查询参数跳转后数据不更新 --&amp;gt; &amp

Vue——路由变化页面数据不刷新问题

Boboy

07-09

1万+

在项目中出现的情况是路由变化后，url变化了，但是页面没有刷新，手动刷新一下才出现应有的画面。情况一：在 github 的 vue-router 中找到同样的一个问题：3.0.1版本通过router实例无法跳转昨天发现有些路由不能正常跳转，找了一下发现都是那些实例化后使用 router.push 而不是直接使用 this.$router.push 的地方。注意： 1.this.$ro...

Vue 路由切换时页面内容没有重新加载

热门推荐

携手天下

03-05

4万+

第二次进入页面，页面路由参数已经改变，但是页面内容不会刷新。问题原因：在组件mounted钩子中调用的刷新页面内容，但测试发现这个钩子没有被调用。后来发现App.vue中使用了<keep-alive>：<template> <div id="app"> <keep-alive> <router-view></..

vue 跳转同一路由不刷新问题解决

qq_34507902的博客

05-07

1685

主要问题　　vue 同一路由跳转不走生命周期，导致数据不更新　　不管是动态路由还是？传参。都不走办法一：　　使用watch 监听路由变化。手动更新数据。办法二：　　使用 <router-view :key="$route.fullPath"/> 使用这个可以完美解决不刷新问题。　　使用router-view时，如果在相同路由之间跳...

vue单页面多路由缓存问题，解决多路由前进刷新，后退不刷新问题

chaitong2204的博客

08-30

4203

同一组件被多次复用，有时需要缓存页面数据有时不需要缓存页面数据，最初想到的方法是利用 keep-alive 来进行页面缓存，经过一番验证发现单纯的用keep-alive是行不通的，原因如下 keep-alive 会对已加载过的路由进行缓存，而我同一个页面多次复用显然使用的都是同一个路由，所以在加载过一次之后，之后不管从哪里点击到该页面都是缓存的第一次的数据，这显然不是我们想要的结果。还有...

VUE-Router 同一页面第二次进入不刷新问题以及几个解决方案。

还想做MAD

10-31

3万+

最近正好遇到一个问题，修改用户的头像，修改后再进入用户主页，发现改了之后即使数据变了。。页面也不会重新渲染。。。下面提供集中解决方案来给予大家参考：1. 可以在刷新的页面定义一个参数, 这样每次都会渲染出不同的页面： route 实例化命名配置： { // 用户信息 path: '/accountDetail/:randK...

Vue 跳转相同路由不同参数，解决页面数据不自动刷新

_夜渐凉

02-01

1万+

vue-router 是Vue.js官方的路由插件，它和vue.js是深度集成的，适合用于构建单页面应用。vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。传统的页面应用，是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中，则是应该是路径之间的切换，也就是组件的切换因此，如果需要跳转相同路由不同参数时，必须确保组件需要重新被渲染 ...

vue路由带参跳转页面不刷新(两种方法)总结

LONGLONGAGO_RU的博客

05-30

3913

路由参数变化但是页面没有刷新这是Vue的组件复用的默认处理方式解决办法：一：不想复用的话，就在父组件的router-view上加个key（不推荐使用） <router-view :key="new Date().getTime()"></router-view> 但是vue为了提高性能不建议每次跳转都刷新组件二：添加路由监听，路由改变时执行监听方法（推荐） meth...