首页 > 解决方案 > 在没有点击事件Vue js的情况下在子组件之间传递“ref”

问题描述

我有两个兄弟组件,一个有一个表单,提交按钮在下一个组件中。我想将 ValidateObserver(来自 vee-validate)作为参考传递给其他子组件。我使用全局 Eventhub 在兄弟组件之间进行通信。

// Component A
    <template>
        <ValidationObserver v-slot="{ handleSubmit }" ref="FullForm">
          <form @submit.prevent="handleSubmit(buildingForm)">
    </template>

methods:{             

        buildingForm(){
            this.eventHub.$emit('building-form', data)
         
        },
},

我在组件 B 上发现了它

 //Component B

    methods(){

             buildingValidation(){
             this.$refs.FullForm.validate().then(success => {
                 if (!success) {
                     return this.step.id == this.currentstep;
                 }

             });
            

        },
             }
    
    created(){

            this.eventHub.$on('building-form', data => {  

            //Here I'm calling the function buildingValidation()

            console.log(data);     
            
            
            })
                
    
        },

我错过了什么?谢谢

标签: vue.jsvuejs2vee-validate

解决方案


推荐阅读