关于Vue中，$this.router.push到当前页面，只是传入参数不同，页面不刷新的问题解决...

最新推荐文章于 2024-05-16 15:17:37 发布
最新推荐文章于 2024-05-16 15:17:37 发布
阅读量2.9k 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/jane2160/p/11573315.html
版权

 

 

在页面的watch中，监听$router的变化

watch: {
    $route (to, from) {
      this.$router.go(0)
    }
  }

其中this.$router.go(0)为刷新页面，但此方法可能在Safari中无法实现，还可以用js原生的方法：window.location.reload()

转载于:https://www.cnblogs.com/jane2160/p/11573315.html

weixin_30877181
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue 使用this.$router.replace、this.$router.go、this.$router.push 等进行页面跳转不生效
絮落锦乡的博客
03-27 8492
一、问题描述 vue 在使用页面跳转的时候，发现页面总是不调转，或者地址变了，页面不刷新等问题 二、解决方案 1、排查页面是否使用了beforeRouteLeave ，如果使用了该函数，意味着路由被拦截下来进行处理了，这个时候做完逻辑处理后必须要加上 next() 函数，才能让路由继续跳转，否则页面将不会跳转。 2、排查页面是否报错，哪个方法未定义。 3、检查路由配置是否正常。 ...
$router.push，只是路由参数改变，页面无反应的解决方法
qq_42345237的博客
09-08 3678
这里咱们需要监听路由的变化，从而实现数据的重新加载。 首先，把数据加载单独提出来，在created的时候执行这个方法，然后监听路由的变化： watch: { '$router' (to, from) { // 监听路由参数变化，重新加载数据 this.getInit(); } } ...
router.push不刷新（8种解决方案）
leveretz的博客
11-13 1万+
router.push不刷新（8种解决方案）
vue $router.push跳转同页面只是参数不同。但是页面数据不刷新的解决办法（图文版）
最新发布
weixin_45721912的博客
05-16 481
【代码】vue $router.push跳转同页面只是参数不同。但是页面数据不刷新的解决办法（图文版）
VueRouter 中' this.$router.push '跳转页面不刷新的问题解决
gyy191425的博客
05-28 1万+
问题疑难 在写vue项目 路由跳转时, 肯定遇到过 路由跳转到新页面后 通过接口查询得到的后台数据, 这时候再返回上一个页面再点击路由跳转的时候会发现 新页面通过接口查询的数据没有了。 这是因为再你第二次点击路由跳转的时候，你的初始函数方法mounted没有执行。 解决办法有两种： 第一种：将mounted函数 替换成activated函数。 mounted(){ 在这里插入代码片 } ...
vue3使用router.push()页面跳转后，该页面不刷新问题
wang13679201813的博客
09-20 7340
这是一个常见问题，当使用push的时候，会向history栈添加一个新记录，这个时候，再添加一个完全相同的路由时，就不会再次刷新了。在页面跳转时加上params参数时间。在跳转到的页面，添加watch监视。
vue-router 2.0 跳转之router.push()用法说明
10-14
针对描述中提到的问题，即在 iOS 设备上点击返回键时，路由改变但页面内容不更新，解决方案是利用 Vue Router 的导航守卫。可以在首页组件中添加 `beforeRouteLeave` 钩子，阻止返回到登录页的操作： ```javascript...
详解vue-router 2.0 常用基础知识点之router.push()
12-02
在Vue Router 2.0中，`router.push()` 是一个非常重要的方法，用于程序化地导航到新的URL。它的工作原理是将新的记录添加到浏览器的历史堆栈中，这意味着用户可以通过点击浏览器的后退按钮返回之前的状态。 `router...
vue从一个页面跳转到另一个页面并携带参数的解决方法
10-16
总结，Vue.js中实现页面跳转并携带参数主要依赖于`this.$router.push()`方法，结合Vue Router的路由配置，以及在目标页面中通过`$route`对象获取并使用这些参数。正确理解和运用这些知识，可以轻松地实现在Vue应用中...
vue.js使用watch监听路由变化的方法
10-18
`$route` 是Vue Router注入到每个组件实例的一个属性，它包含了当前激活的路由信息。 以下是一个基本的示例，展示了如何在Vue实例中设置 `watch` 监听 `$route.path` 的变化： ```javascript let vm = new Vue({ ...
VueJs路由跳转——vue-router的使用详解
10-20
在JavaScript中，需要创建一个VueRouter实例并传入配置参数： ```javascript var router = new VueRouter({ routes: [ { path: '/view-a', component: ViewA }, { path: '/view-b', component: ViewB } ] }); ...
关于vue路由跳转后的页面不会刷新的解决办法
qq_51632935的博客
10-11 1万+
关于vue路由跳转后的页面不会刷新的解决办法
vue this.$router.push 页面不刷新总结(8种解决方式----覆盖所有场景)
热门推荐
qq_38143787的博客
10-23 3万+
这其实是一个很常见的问题,当使用push的时候,会向 history 栈添加一个新的记录,这个时候,再次添加一个完全相同的路由的时候,就不会再次刷新了. 没有耐心的可以直接看第九种方式,绝绝子,适用所有场景. 解决办法有这么几种: 1. 添加activated函数。 activated（）{ 在这里插入代码片 } 2. 通过路由监听的方法。将mounted下的方法函数放到watch路由下 // 不推荐、用户体验不好 watch: { '$route' (to, from) { // 路由发
解决使用this.$router.push()方法页面跳转后不加载列表刷新的方法问题
小馒头味的博客
07-20 2万+
解决使用router.push方法页面跳转后不加载列表刷新的方法问题 注意:created()方法是无效的 方法:在需要刷新的页面添加以下内容 watch:{ $route(){ //跳转到该页面后需要进行的操作 } }, ...
this.$router.push跳转到原来页面不刷新的问题解决
weixin_42349568的博客
04-07 4576
一，现象 现在的情况是编辑页面编辑更新数据后，返回旧界面，应该触发生命周期函数，重新获取数据的，但是生命周期函数并没有触发。 二，原因分析 主要原因是使用了keep-alive对组件进行了缓存，而后改用actived生命周期函数，依旧是无效，这大概率是因为我当初为了做面包屑导航，使用了嵌套路由的结构： 也就是现在导致返回上一级路由时，不触发actived生命周期函数了。 三，解决方案 这个页面不使用缓存，并且给router-view加上key <keep-alive exclude="dishe
Vue用router.push（传参）跳转页面，参数改变，跳转页面数据不刷新的解决办法
zhan_lijian的博客
06-24 1万+
this.$router 相当于一个全局的路由器对象，包含了很多属性和对象（比如 history 对象），任何页面都可以调用其 push(), replace(), go() 等方法。 this.$route 表示当前路由对象，每一个路由都会有一个 route 对象，是一个局部的对象，可以获取对应的 name, path, params, query 等属性。 关于 push() 方...
this.$router.push()跳转页面不刷新 （分页组件点击，query参数变化）
weixin_46331416的博客
02-23 3902
this.$router.push()跳转页面不刷新 问题： 我有一个动态路由：/page/:offset?,但是我用query传参的时候，页面却不刷新，
vue中使用 this.$router.push跳转页面，地址跳转成功但是页面不刷新
坚果程序开发存档博客专栏
08-02 3170
vue中使用 this.$router.push跳转页面，地址跳转成功但是页面不刷新问题，使用 watch，观察路由，发生变化重新获取数据： <script> export default { data() { return { data: {} } }, methods: { getDataList() { },
vue 改变路由（URL）参数不刷新页面
ingenuou_的博客
09-22 2079
vue 改变路由（URL）参数不刷新页面
vue this.$router.push
08-19
`this.$router.push` 是 Vue.js 中用于进行路由导航的方法。它用于在当前路由上进行导航到不同的页面。 使用 `this.$router.push` 方法可以传入一个路由对象或者一个路径字符串，示例如下： ```javascript // 导航到命名路由 this.$router.push({ name: 'routeName' }); // 导航到带有参数的路由 this.$router.push({ path: '/route/path', params: { id: 1 } }); // 导航到指定 URL this.$router.push('/route/path'); ``` 在 Vue 组件中，`this.$router` 可以访问到 Vue Router 的实例，通过调用 `push` 方法来进行页面导航。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值