vue.js 表单验证插件_简单的Vue.js输入验证插件-CSDN博客

vue.js 表单验证插件

验证 (vee-validate)

vee-validate is a plugin for Vue.js that allows you to validate input fields, and display errors.

vee-validate是Vue.js的插件，它使您可以验证输入字段并显示错误。

You don't have to do anything fancy in your app, most of the work goes into the html, You only need to specify for each input what kind of validators should be used when the value changes. The errors will be automatically generated. The plugin offers many validations out of the box.

您无需在应用程序中做任何花哨的工作，大多数工作都在html中进行，您只需为每个输入指定值更改时应使用哪种类型的验证器。错误将自动生成。该插件提供了许多开箱即用的验证。

vee-validate是什么？ (What is vee-validate?)

This is a plugin for Vue.js that allows you to validate input fields, and display errors, in an easy and powerful way. You don't have to do anything fancy in your app, most of the work goes into the html. You only need to specify for each input what kind of validators should be used when the value changes. You will then get informed of the errors for each field. Although most of the validations occur automatically, you can use the validator however you see fit. The validator object has no dependencies and is a standalone object.

这是Vue.js的插件，可让您以简便而强大的方式验证输入字段并显示错误。您无需在应用程序中做任何花哨的事情，大部分工作都在html中进行。您只需为每个输入指定在值更改时应使用哪种验证器。然后，您将了解每个字段的错误。尽管大多数验证是自动进行的，但您可以使用验证器，但可以认为合适。验证器对象没有依赖关系，并且是独立对象。

Currently there are over 20 validation rules available in the plugin. This plugin is inspired by PHP Framework Laravel's validation syntax.

当前，插件中提供了20多种验证规则。该插件的灵感来自PHP Framework Laravel的验证语法。

安装 (Installation)

You can install this plugin via npm or via a CDN. npm

您可以通过npm或CDN安装此插件。 npm

npm install vee-validate --save

CDN

jsdelivr cdn unpkg

<script src="path/to/vue.js"></script>
  <script src="path/to/vee-validate.js"></script>
  <script>
    Vue.use(VeeValidate); // good to go. 
  </script>

or you may import it using ES6:

或者您可以使用ES6导入它：

import Vue from 'vue';
import VeeValidate from 'vee-validate';

Vue.use(VeeValidate);

现场演示 (Live Demo)

http://vee-validate.logaretm.com/

翻译自: https://vuejsexamples.com/simple-vue-js-input-validation-plugin/

vue.js 表单验证插件