分享一款Vue.js表单验证插件：vee-validate指南

简单

熟悉且易于设置的声明式验证

灵活

同步、异步、字段级或表单级验证

快

使用直观的 API 和较小的占用空间更快地构建更快的表单

Minimal

只处理复杂和痛苦的形式问题，让您完全控制其他一切

占用空间小

占用空间小 < 5kb 这使您的应用程序加载速度更快

UI 不可知论

使用原生 HTML 元素或您最喜欢的 UI 库组件

Progressive

无论您使用 Vue.js 作为渐进式增强还是在复杂的设置中，都适用于任何设置

内置规则

包含 25 条以上规则的配套库，涵盖了大多数 Web 应用程序中的大部分需求

i18n

来自世界各地的开发人员贡献的 45 多个内置规则的语言环境

# install with yarnyarn add vee-validate@next# install with npmnpm install vee-validate@next --save

<script src="https://unpkg.com/vee-validate@next"></script>

import { Field, Form } from 'vee-validate';export default {
  components: {
    Field,
    Form,
  },
  methods: {
    // Validator function
    isRequired(value) {
      return value ? true : 'This field is required';
    },
  },};

<Form v-slot="{ errors }">
  <Field name="field" :rules="isRequired" />

  <span>{{ errors.field }}</span></Form>