如何停止在 Vuetify 中显示内联验证错误消息?

问题描述

当用户点击提交时，我需要在表单顶部的一个警报中显示所有表单验证错误(不与输入元素内联).

I need to display all form validation errors in one alert at the top of a form when the user clicks submits (not inline with the input elements).

如果我使用 Vuetify 和 Vee-Validation，我该如何抑制内联验证错误消息.(我将使用 $errors 数组在警报中显示错误).文档中没有任何相关内容.

How do I suppress the inline validation error message if I am using Vuetify and Vee-Validation. (I will display errors in an alert using the $errors array). There is nothing about this in the documentation.

我尝试在错误消息中不传递任何内容，但随后我丢失了无效字段上的红色轮廓.

I tried not passing anything in error-messages, but then I lose the red outline on the invalid field.

我的字段是这样配置的

<v-text-field
     v-validate="'required|email'"
     v-model="email"
     :error-messages="errors.collect('email')"
     label="Email Address*"
     data-vv-name="email"
     required
     outline>
</v-text-field>

推荐答案

如果您不需要在输入组件中显示任何提示"，您可以将 hide-details 设置为 true.

If you do not need to display any 'hints' with your input component, you can set hide-details to true.

我希望有一种方法可以在不干扰提示的情况下隐藏错误消息.

I wish there was a way to hide the error message without interfering with the hints.

  <v-text-field
    v-validate="'required|email'"
    v-model="email"
    :error-messages="errors.collect('email')"
    label="Email Address*"
    data-vv-name="email"
    hide-details=true
    required
    outline>
  </v-text-field>

这篇关于如何停止在 Vuetify 中显示内联验证错误消息?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！