错误消息未出现在Vue和Vuetify中

Question

我在VueApp中使用了Vuetify和Vee-Validate。

我尝试使用<span>{{ errors[0] }}</span>，它出现了，但当我尝试:error-messages="errors[0]"时，它没有出现。

                  <ValidationProvider rules="required|email" name="Username" v-slot="{ errors }">
                    <v-text-field
                      label="Username"
                      v-model="form.username"
                      type="email"
                      outlined
                      hide-details
                      :error-messages="errors[0]"
                    ></v-text-field>
                      <span>{{ errors[0] }}</span>
                  </ValidationProvider>

Answer 1

hide-details属性隐藏了组件中显示错误消息的部分。尝试使用hide-details="auto"，默认情况下会将其隐藏，但会在出现错误/提示时显示。