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"，它会默认隐藏它，但在有错误/提示时显示。