在使用ValidationProvider时，VeeValidate无法查看错误
的原因可能有以下几种：
- 验证规则未正确设置：请确保在ValidationProvider组件中正确设置了验证规则。验证规则可以通过
rules属性进行设置，可以是一个对象或者一个函数。对象形式的规则可以包含多个验证规则，而函数形式的规则可以根据需要进行自定义验证。 - 错误信息未正确显示：VeeValidate提供了多种方式来显示错误信息，包括
error-messages属性、v-slot指令和v-messages组件。请确保在ValidationProvider组件中正确设置了错误信息的显示方式，并且绑定了正确的错误信息。 - 表单未正确绑定：请确保ValidationProvider组件正确绑定了需要验证的表单字段。可以通过
vid属性来指定字段的唯一标识，然后在ValidationProvider组件中使用name属性来绑定该字段。 - VeeValidate配置错误：请确保在使用VeeValidate之前正确配置了VeeValidate。配置可以通过
extend方法来添加自定义验证规则，也可以通过configure方法来设置全局配置。
如果以上方法都无法解决问题，建议参考VeeValidate的官方文档进行进一步的排查和调试。以下是腾讯云相关产品和产品介绍链接地址：
相关·内容
我正在使用vue create CLI构建一个定制的Vue JS插件。我已经导入了我的各种包，但是，当尝试在VeeValidate中使用自定义设置时，会出现一个错误。
plugin.js
/*
* NOTE:
* This file is plugin stub for main.js
*/
// Import required packages
import Vue from 'vue'
import VeeValidate from 'vee-validate'
import VueResource from 'vue-resource&
浏览 0提问于2019-05-16得票数 2
我试图使用ValidationObserver创建一个使用vee验证3.0的小提琴，但我遇到了一个问题，就是试图添加行：
import {ValidationObserver, ValidationProvider, extend} from 'vee-validate'
import {required, email, url} from 'vee-validate/dist/rules'
控制台出错了：
Uncaught SyntaxError: Cannot use import statement outside a module
这是用错误保存的：
怎
浏览 1提问于2019-12-21得票数 0
回答已采纳
2回答
从VeeValidate可用规则中，可以使用oneOf 验证select
<ValidationProvider rules="oneOf:1,2,3" name="number" v-slot="{ errors }">
<select v-model="value">
<option value="1">One</option>
<option value="2">Two</option>
<
浏览 5提问于2020-08-05得票数 4
我正在尝试构建一个严格使用类型记录输入的vue.js项目。
我使用VeeValidate构建一个表单。我使用对VeeValidate ValidationObserver的引用来处理提交的表单。我也使用vue类组件。
下面是我如何尝试在代码中键入ValidationObserver组件。
<template>
<ValidationObserver tag="form" ref="repertoireForm" @submit.prevent="submitForm">
<ValidationProvid
浏览 8提问于2019-10-03得票数 5
我有vee验证设置和工作在我的NuxtJS项目和验证工作很好，但我不能访问$validator，它总是没有定义.
我的插件文件：-
import { extend, ValidationObserver, ValidationProvider } from "vee-validate";
import * as VeeValidate from "vee-validate";
import { required } from "vee-validate/dist/rules";
extend("required", {
..
浏览 2提问于2020-06-14得票数 2
当我添加： Vue.use(VeeValidate); 我的Vue页面显示为空白，并显示控制台错误： TypeError: plugin is undefined 我发现以下代码具有相同的错误： Vue plugin vee-validate not installing properly 但是我并没有在我的.vue文档中的任何地方使用=>语法。 vee-验证3.0.3，Vue 2.6.10 完整的main.js文件： import Vue from 'vue'
import VeeValidate from 'vee-validate';
import
浏览 211提问于2019-08-30得票数 5
回答已采纳
1回答
js
VeeValidate.Validator.extend('requireWithoutAll', {
validate: (value, [ ...target ]) => {
return value && _.compact(target).length;
},
getMessage: (field, [...target]) => 'The ${field} is required when none of ${target} are present.'
}, {
hasTarget: t
浏览 1提问于2020-09-28得票数 1
回答已采纳
当没有填充带有"cpf“规则的组件MyInput时，我想更改错误消息(换句话说，当具有"cpf"规则的组件不满足”必需的“规则时)。
我认为带有自定义消息的“字典方法”应该可以完成这项工作，但我无法让它工作。
下面的代码显示的错误消息是"O campo cpféobrigatório“。我想在字典中显示(“preencher o cpf”)下面的字典中的信息。我认为这本字典由于某种原因没有被考虑。
在我的main.js中，我有以下代码：
import Vue from 'vue';
import App from './App.vue&#
浏览 0提问于2019-03-10得票数 0
回答已采纳
我遇到了一个在bootstrap b-table和veevalidate上创建可编辑行的问题。是否可以创建多个ValidationObservers并通过调用一个方法来验证它们？
<b-table :items="items">
<template v-slot:cell(foo)="data">
<ValidationObserver>
<ValidationProvider v-slot="{ errors }" rules="required&
浏览 22提问于2020-02-04得票数 0
在我的组件中，提交btn是禁用的，直到在输入字段中输入值。但是，在挂载组件后，组件似乎还不稳定，验证未运行，因此btn未禁用，其文本为“set status”。因此，测试失败，出现以下错误： Expected value to equal:
"set status disabled"
Received:
"set status" 期望的是该按钮处于禁用状态，并且文本为“set status disabled”。 在浏览器中，行为是正确的。 HelloWorld.vue <template>
<div class
浏览 25提问于2019-01-23得票数 0
我正在使用VeeValidate在最新的VueJs应用程序中应用多重验证，但这不起作用。这个正则表达式只允许字母、数字、空格和一些特殊字符。但是，VeeValidate总是返回false。
<ValidationProvider name="Address"
:rules="{
required: t
浏览 86提问于2020-02-04得票数 0
回答已采纳
使用VeeValidate，在移动平台上对基本表单的验证似乎存在问题。
尽管用户更正了条目，但表单仍继续报告错误。桌面浏览器没有问题。
我使用的是vue 2.6.11，vee-valid3.4.5，我正在使用Android 8和Google键盘的手机上使用Firefox进行测试。
<template>
<ValidationProvider rules="required|min:2" v-slot="v">
<input v-model="value" type="text">
浏览 6提问于2020-11-16得票数 1
在我的Laravel+Vue.js SPA (单页应用程序)中，我使用的是来自的电话号码输入验证包、来自的BootstrapVue和来自的Veevalidate。
我想我只需要在组件文件中显示代码。vue-phone-number-input组件显示蓝色边框和HTML5错误消息工具提示(?)对于无效的数据，但name 字段中没有出现红色错误消息。我的代码在EditProfile.vue中遵循
<ValidationObserver ref="form" v-slot="{ passes }">
<div id="reg
浏览 5提问于2019-12-22得票数 1
我有一个用BootstrapVue构建的表单。为了验证表单输入，我遇到了VeeValidate。
select输入是较长窗体的一部分，目前如下所示：
<form action="">
...
<b-form-select size="sm" v-model="selected" class="mb-2 form-group">
<option :value="null" disabled>Payments per Year</option>
<
浏览 3提问于2019-12-18得票数 0
回答已采纳
代码如下：https://codesandbox.io/s/veevalidate-with-vueselect-13g9d 我使用了一个自定义组件，因为我想覆盖VueSelect中的几个插槽。我正在使用ValidationProvider，但这似乎不起作用。 我曾寻求帮助，但只找到了使用VeeValidate 2.x的示例。
浏览 24提问于2019-10-17得票数 2
回答已采纳
1回答
因此，即使ValidationProvider提示错误，我也会输入错误文本，但是submit form应该运行saveAccount。即使文本是可以的，它也不能工作。我没有错误，没有反应，然后我点击提交按钮。我使用的是veeValidate 3.3.0
<template>
<ValidationObserver v-slot="{ handleSubmit }"> //this and next line seems to won't work
<q-form @submit="handleSubmit(saveAcc
浏览 21提问于2020-06-04得票数 1
第一次使用VeeValidate，事情看起来是正确的，但我没有从错误中得到任何反馈。按照文档的说明，我已经围绕我的输入实现了ValidationProvider。
<ValidationProvider
v-if="!coinbaseKeys.existing"
v-slot="{ errors }"
rules="required|alphaNum"
>
<span>{{ errors[0] }}</span>
<input>type="t
浏览 6提问于2019-12-02得票数 1
我使用的是VeeValidate v3和coreui。 我的问题是如何避免在onblur事件时进行验证，而只允许在使用VeeValidate的onsubmit事件时进行验证？ <template>
<div class="d-flex align-items-center min-vh-100">
<CContainer fluid>
<CRow class="justify-content-center">
<CCol md="6">
浏览 52提问于2021-04-20得票数 1
回答已采纳
1回答
我想验证文本字段，尝试在下面的代码：
<input v-validate="result.val=='Required' ? 'required' : ''" v-model="required" :name="f_name" type="text"/>
但是得到这个错误：
app.js:48089 Vue警告:未能解决指令:验证
试试看：
<ValidationProvider name="phone" :rules="requi
浏览 3提问于2020-08-14得票数 3
回答已采纳
即时通信工具使用Nuxt js + veeValidate 3.x 我的插件看起来像这样： import Vue from 'vue'
import {
ValidationObserver,
ValidationProvider,
extend
} from 'vee-validate'
import { required, email, min, confirmed } from 'vee-validate/dist/rules'
extend('required', {
...required,
me
浏览 22提问于2019-12-26得票数 5
回答已采纳
1回答
目前我正在尝试添加VeeValidate组件来验证我在Laravel上的表单，我刚刚在NPM上安装了Vue，它似乎可以工作，但是如何为Vue启用组件呢？ 目前我的app.js中有： window.Vue = require('vue');
window.JQuery = require('jquery');
import Vue from 'vue';
Vue.component('ValidationProvider', require('vee-validate')); 并尝试调用视图中的组件：
浏览 21提问于2020-12-22得票数 0
1回答
Vue.js v2.6.11 /vee-验证v3.2.2
我有一个按钮，可以在单击事件上将新元素按到form.demand ( vue应用程序中的数据)。如果form.demand更新，则应更新v-for中的html。在我把它包装在vee验证组件中之后，它就不起作用了。form.demand将更新，但v-for不会。我尝试在测试组件中添加相同的html，当form.demand更新，v-for更新时。我搞不懂为什么..。
以下是我的代码：
<div id="content">
<test-component>
<div v-for=
浏览 1提问于2020-01-27得票数 1
回答已采纳
我从CDN安装了veeValidate，并像这样添加到我的cshtml中：
Vue.component(‘验证提供者’，VeeValidate.ValidationProvider)；
如何将本地语言从en更改为fr或其他？
浏览 1提问于2020-12-29得票数 0
1回答
我有一张表格上面写着。在表单提交时，数据将被发送到父级，然后我需要重置表单。按照veevalidate指令，应该可以通过$refs重置表单。
使用：设置参考资料
用：重置表单
我的应用程序在TypeScript中，按照指南，我的组件如下所示：
<template>
<div>
<ValidationObserver v-slot="{ handleSubmit }" ref="form">
<form :model="form" @submi
浏览 3提问于2020-08-02得票数 1
回答已采纳
我使用Vue.js 2和VeeValidate3来验证我的表单。这也是一个axios调用，以检查用户名是否已经在使用。如果是这样的话，显然验证需要是false。
到目前一切尚好。当我输入一个已经在使用的用户名时，我还会看到错误消息Dieser Name wird bereits verwendet。
但是，如果我看到错误消息并单击submit按钮，错误消息就会消失，并且我可以看到在表单提交时打印的消息Submit submitCompleteNormalRegistrationForm。
问题是，为什么表单会被提交--还有一个名字的验证错误？我做错什么了？
此外，在名称未被使用时，如何将名称的
浏览 7提问于2020-09-01得票数 0
我正在尝试使用VeeValidate v3来验证给定日期的开始时间和结束时间是否可用于预订。在我的表单中，我将日期分开显示，然后输入两个字段作为开始和结束时间。在我的.extend规则中，我有几个问题。日期不是表单的一部分，那么如何在extend中访问它呢？我的第二个问题是，指示正在验证哪个字段的最佳方式是什么(值是开始时间还是结束时间)？ 到目前为止，我的字段如下所示： <ValidationObserver>
<div class="w3-third">
浏览 9提问于2020-01-14得票数 1
我无法在外部文件中添加规则。
如果我使用下面的代码，我得到了错误未定义的ReferenceError: required is
import Vue from 'vue'
import { ValidationObserver, ValidationProvider, extend } from 'vee-validate';
import { required } from 'vee-validate/dist/rules';
extend( 'required', required );
Vue.component(
浏览 3提问于2020-07-27得票数 1
2回答
我刚刚开始学习Vue并开始验证。
我已经找到了一些使用Vee验证的旧示例，但是最近它似乎已经改变了。如何将此代码转换为使用新版本的Vee-验证？
据我所知，下面的代码试图发送一个定制错误消息，而不是默认的，如果有一个错误的屏幕。
Chrome告诉我，它无法读取未定义属性的“第一”属性，因此我认为我无法使用this.errors访问错误。
是否仍然可以访问“计算”内部的errors？
<template>
<div>
<ValidationProvider rules="required" v-slot="{ errors }&#
浏览 0提问于2019-11-03得票数 1
回答已采纳
1回答
当没有提供v-模型时，我在vee和验证中遇到了一个问题，但是我们有@input和value。
这是我的CodeSandbox链接：
我试图生成的是验证添加到列表中的每个新行，当用户在TextArea中输入某些内容时，我想要被验证？
浏览 1提问于2020-03-25得票数 0
回答已采纳
我是Vue和Nuxt的新手，我似乎无法克服这个错误：
Vue警告:属性或方法“必需”不在实例上定义，而是在呈现过程中引用
这是源代码：
vee-valdate.js：
import Vue from 'vue'
import {ValidationProvider, ValidationObserver,extend} from 'vee-validate'
import {required,email} from 'vee-validate/dist/rules'
Vue.component('ValidationProvider&
浏览 5提问于2021-07-07得票数 1
1回答
是否可以创建用于多个元素的通用验证规则？
genericRule: {
required:'required',
min:'min',
etc..
}
论形式
<ValidationProvider
name="genericRule"
rules="required|min|etc"
>
<input v-model='a'/>
</ValidationProvider>
<ValidationProvider
name="genericRul
浏览 3提问于2021-07-26得票数 1
回答已采纳
我已经导入了必要的组件 import { ValidationProvider, ValidationObserver } from 'vee-validate' 我已经注册了他们 Vue.component('ValidationProvider', ValidationProvider)
Vue.component('ValidationObserver', ValidationObserver) 但是当我尝试访问$validator时，我得到了这个错误。简单的console.log(this.$validator)不起作用。 这是模板
浏览 3提问于2020-11-09得票数 0
正在尝试在规则中执行服务器端验证。它是这样的： validate(value, {fname, fid } ) {
return(axios({
method: 'post',
url: 'xyz.php'
})
.then(function (response) {
return response.msg === 'available
浏览 34提问于2020-01-16得票数 0
嗨，我有一个关于Vee-validation和Vuetify集成的问题:这是我的配置： import { ValidationProvider, extend } from 'vee-validate';
import { required } from 'vee-validate/dist/rules';
extend('required', {
...required,
message: '{_field_} can not be empty'
});
Vue.component('ValidationP
浏览 19提问于2020-03-25得票数 0
回答已采纳
好的，这是情况，我正在用Vue.js做一个SPA。我在我的组件中使用VeeValidate，比如在Component1.vue中，
import Vue from 'vue';
import VeeValidate from 'vee-validate';
Vue.use(VeeValidate);
export default {
//...
}
在另一个组件中，比如在Component2.vue中，我使用的是vuetable-2，我是这样注册的，
import Vuetable from 'vuetable-2/src/component
浏览 2提问于2018-04-09得票数 1
1回答
我正在尝试使用vuejs中的veeValidate生成带有验证的动态表单，我尝试这样做的方式是在组件的数据中创建一个对象数组，例如：
data(){
return{
inputs: [
{
id: 1,
label: "first name",
type: "text",
placeholder: "",
model: "",
rules: "required"
},
{
浏览 27提问于2020-05-24得票数 2
回答已采纳
1回答
我很难找到只在提交时触发错误的表单验证。我不想显示内联错误的主要原因是，本文暗示内联错误提供的用户体验比在提交时提供错误消息更糟糕：
即使vee验证3文档声明在提交之前进行验证是“必须”：
不幸的是，这篇文章涵盖了vee-验证2而不是3：
这篇文章讨论了如何在提交时捕获错误，但是我不明白如何在提交之前禁用错误：
Vee-验证2对此有一些明确的说明，但我似乎无法在Vee-验证3文档：中找到它。
我正在使用Vuetify和Nuxt，并在我的插件中注册了vee验证：
import { extend } from "vee-validate";
import { required
浏览 2提问于2020-10-26得票数 1
是否可以在VeeValidate (选项classNames)中设置多个类？
我使用VeeValidate进行Vue.js表单验证。有一些选项：'classes: true，classNames:有效和无效的css类‘。
我想使用引导‘警报-警告’。但是，当我在下面添加类名时，会收到以下错误消息：
DOMException:未能在‘DOMTokenList’上执行'remove‘：所提供的令牌(’警报-警告‘)包含HTML空格字符，这些字符在令牌中无效。
除了创建一个新的css类之外，还有其他解决方案吗？
代码：
Vue.use(VeeValidate, {
class
浏览 0提问于2019-01-03得票数 1
回答已采纳
1回答
我试图在不使用的情况下使用npm install --save插件进行表单验证，所以我将dist文件夹中的文件复制到我的项目中，但由于某些原因，我无法正确地使用插件。
这就是我如何将插件作为脚本在我的pug文件register.pug中调用。
block main-content
.article#register
form
input(
v-model="email"
v-validate.initial="'required|email'"
:class="{'input&#
浏览 0提问于2018-03-16得票数 0
回答已采纳
我正试图为用VeeValidate编写的VueJS组件创建一个自定义的TypeScript规则。该规则需要按照的指南一起验证两个字段--下面是一个片段：
<div class="form-group">
<checkbox name="noBarcode" v-model="currentProduct.noBarcode" label=" " />
<i class="info-icon btn-base
浏览 1提问于2020-08-24得票数 1
1回答
我在表单中使用了validate指令来验证内容。
<input type="text" v-model="address" name="address" ref="address" v-validate="{ regex:/^([0-9]+|[0-9]+,[0-9]{0,2}?)$/ }" data-vv-validate-on="blur">
但它返回的错误如下：
vue.runtime.esm.js?2b0e:619 [Vue warn]: Failed to resolve dir
浏览 0提问于2020-04-18得票数 1
我有这个脚本，它在通过api发布表单后，在特定字段中手动添加错误消息。
this.errors.add('registration-form.shipping_vmoney_email_address',response.data.message);
这是我的HTML：
<input autocomplete="new-email" nofill v-model="shipping_vmoney_email_address" name="shipping_vmoney_email_address" v-validate=&#
浏览 3提问于2017-08-09得票数 2
我想以vuejs的形式给出验证，因为我使用的是vee验证。
我的vue js版本是2.6.10
并安装运行-npm安装vee验证
I在main.ts:中声明
import VeeValidate from "vee-validate";
Vue.use(VeeValidate);
但有错误
“导出‘默认’(导入为'VeeValidate')在‘VeeValidate’中没有找到。
和控制台：
无法读取Function.Vue.use上未定义的属性“安装”
浏览 2提问于2019-08-27得票数 9
回答已采纳
我试图添加验证提供者的密码和确认密码的验证规则。验证必须在我必须向文本框中添加规则的地方工作。但是在我的例子中，我必须使用验证提供程序。救命啊！
版本
vee-validate: 2.1.7
vue: 2.9.6
码
<ValidationObserver ref="adminInfo">
<v-layout row wrap>
<v-flex xs12 md6>
<ValidationProvider name="password" rules="required|min:5|max:35" r
浏览 1提问于2019-03-11得票数 6
回答已采纳
在让Autofac注册我的类型时遇到一些问题。
我有以下基于另一个堆栈溢出帖子的设置。
我的设置如下
public interface IValidator : IDependancy
public abstract class Validator<T> : IValidator
public class UserValidator : Validator<AccountModel>
sealed class ValidationProvider : IValidationProvider
{
private readonly Func<Type,
浏览 1提问于2012-07-19得票数 0
我正在尝试使用Vue 2.5和VeeValidate 2.1来使用VeeValidate来验证Vue表单中的字段。按照文档的说明，我将验证如下所示的字段：
<input class="form-control"
name="contact-email"
id="contact-email"
type="email"
v-model="contact-email"
v-validate="'required|email'"
>
<span v-if="er
浏览 3提问于2018-06-14得票数 0
1回答
我有根组件和子组件。我尝试在子组件中添加输入事件的验证数据，并在根组件中使用result。在子进程中 <ValidationProvider
:bails="false"
:rules="validation"
slim
:vid="id"
ref="provider"
:name="id"
>
<textarea
:value="value"
@input
浏览 11提问于2020-07-28得票数 0
回答已采纳
在Vue2 /Vee-验证3中，可以执行以下操作来验证任何深度的输入：
<FormWrapper>
<ValidationObserver ref="validation">
<ChildComponent1>
<ChildComponent2>
<ValidationProvider rules="required">
<FormInput id="first-name" />
浏览 30提问于2022-09-17得票数 1
回答已采纳
我正在尝试在Vee-Validate 3中查找并使用ValidationFlags类型。但是我无法导入它。 我知道该类型存在于source code here中。但是当我尝试像这样导入它时： import { ValidationObserver, ValidationFlags } from "vee-validate"; 它说它没有导出的成员ValidationFlags，下面是一些示例代码，供我尝试做的参考： <template>
<ValidationProvider v-slot="validationContext">
浏览 16提问于2020-01-22得票数 4
回答已采纳
在@vue/cli 4.0.5应用程序中，我需要向ValidationProvider规则添加附加的URL检查。我的代码：
<ValidationProvider
name="website"
rules="{ required : true, url: {require_protocol: true} }"
v-slot="{ errors }"
>
但是得到了这个控制台错误：
不存在这样的验证器“{ required”。
用rules
rules="required : true,
浏览 3提问于2019-12-19得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
