vue.js表单验证_Vue.js的验证表单

vue.js表单验证

将验证 (willvalidate)

Validation Forms for Vue.js.

Vue.js的验证表单。

建立 (Setup)

安装依赖 (Install dependencies)

npm install willvalidate --save

进入main.js vuejs(单个文件组件) (Into main.js vuejs (Single File Components))

import Vue from 'Vue'
import willvalidate from 'willvalidate'
Vue.use(willvalidate)

用法 (Usage)

例如：方法内 (Ex: within methods)

export default {
  methods:{
    sendForm()
    {
       this.willvalidate( document.querySelector("#form") ) ? console.log("ok") : console.log("error")
    }
  }
}

或在脚本标签中 (Or in script tag)

<script src="./PATH/node_modules/willvalidate/dist/willvalidate.js"></script>

使用Attr html5进行验证 (Use Attr html5 for validation)

Ex: require, maxlength, minlength, type, pattern, min, max and others

定制 (Customize)

# error class 
.has-danger{}
 
# set errorMessage | optional - if not informed will show default message
Ex: <input type="number" min="5" max="20" errorMessage="Preencha corretamente" required  />

翻译自: https://vuejsexamples.com/validation-forms-for-vue-js/

vue.js表单验证