自定义路由跳转页面数据不更新解决办法

飞流银河

已于 2023-12-14 15:11:11 修改

阅读量733

点赞数 21

分类专栏：前端文章标签：前端

于 2023-12-13 19:35:37 首次发布

版权

58 篇文章

订阅专栏

文章讨论了在Vue应用中，使用watch监听数据更新时遇到的问题，尤其是在多个组件共用同一页面的情况下。作者推荐通过设置不同的路由地址并利用路径参数或query来避免冲突，同时指出直接在query中放置时间戳无法更新数据，最佳实践是结合路由参数和监听路由更新来管理数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

watch虽然能监听数据更新变化，但是当有的地方共用一个页面的时候，仍旧会出现问题。

根本的解决办法是使路由地址不同，虽然页面是相同的。

采取的方式是使用路径参数，如果传的参数比较多，需要传对象。就使用query传递，使用params不能改变标题路由。

this.$router.push({ name: 'SecondPage',path:"/index/secondIndex/second",
        query:{type:type,mainEnterpriseCategory:mainEnterpriseCategory}});

使用query里放时间戳也同样不能更新页面数据，经测试

最好的方式是上面的query或者路径参数+watch监听路由更新数据