vue中单页面项目中使用this.$router.push 不能触发到push里路径中的方法

最新推荐文章于 2025-05-10 10:37:48 发布

一个写bug的人

最新推荐文章于 2025-05-10 10:37:48 发布

阅读量2.5k

点赞数

分类专栏： web前端

本文链接：https://blog.youkuaiyun.com/weixin_42484910/article/details/106491189

版权

web前端专栏收录该内容

38 篇文章

订阅专栏

本文探讨了在Vue.js项目中，如何在父组件与子组件间通过路由参数和$refs进行有效通信。具体介绍了在特定路由路径下，利用$refs触发子组件方法的场景，以及在不同路径下使用路由push进行页面跳转的策略。

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

父组件中
if(this.$route.path == '/auditOrder'){
            this.$refs.save.getReportListDataA('message',angs)
          }else{
            this.$router.push({
              name: 'auditOrder',
              params: {
                msgNavigateType: item.mainBodyType,
                msgNavigateId: item.mainBodyId,
              }
            })
          }

子组件
created(){
        if(this.$route.params == null || this.$route.params == undefined ){
            this.getReportListDataA()
        }else{
            this.msgSourceType = this.$route.params.msgNavigateType
            this.msgSourceId = this.$route.params.msgNavigateId
            let angs={
                moduleStatus:this.msgSourceType,
                id:this.msgSourceId,
            }
            this.getReportListDataA('message',angs);
        }

如果是在本路径为'/auditOrder' 进行页面跳转 跳转到'/auditOrder' 则使用$refs 去触发到getReportListDataA （使用push不起作用 因为是单页面 同个路径跳转 不会再次触发 到created）
如果是在本路径不为'/auditOrder' 进行页面跳转 跳转到'/auditOrder' 则使用push