[Vuejs]-How to make this.$refs.form method work by creating the component before?

by

2👍

✅

you need to add the eager prop to the v-tab-item like so:

<v-tab-item eager> 
    <Form1 ref="form1"/>
</v-tab-item>
<v-tab-item eager>
    <Form2 ref="form2"/>
</v-tab-item>

this means it will render the tab even if it is not visible.

according to vuetify documentation:

When using v-tab-item’s that contain required input fields you must use the eager prop in order to validate the required fields that are not yet visible.

👤Noy Gafni

1👍

Just use the eager prop on your v-tab-item. It will force the component to render even though the tab isn’t selected yet.

<v-tabs-items v-model="tab">
    <v-tab-item eager> 
       <Form1 ref="form1"/>
    </v-tab-item>
    <v-tab-item eager>
       <Form2 ref="form2"/>
    </v-tab-item>
  </v-tabs-items>
👤Kapcash

Leave a comment