element 表单验证

本文主要是介绍element 表单验证，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

手机号验证

        phone: [
          {
            required: true,
            message: '联系电话不能为空',
            trigger: 'blur'
          },
          {
            required: true,
            pattern: /^[1]([3-9])[0-9]{9}$/,
            message: '输入正确的手机号',
            trigger: 'blur'
          }
        ],

输入数字验证，配合v-model.number使用

	v-model.number="form.phone"
     linkPhone: [
          {
            required: true,
            message: '联系电话不能为空',
            trigger: 'blur'
          },
          {
            type: 'number',
            message: '请输入数字',
            trigger: 'change'
          }
        ]

验证中文

rules: {
		    account: [
		       {//第一种验证方式
		         trigger: "blur",
		         validator: (rule, value, callback) => {
		           //中文验证
		           var reg = /[^\u4e00-\u9fa5]/;
		           if (value === "") {
		             callback(new Error("请输入账号"));
		           } else if (!reg.test(value)) {
		             callback(new Error("账号不能为中文"));
		           } else {
		             callback();
		           }
		         }
		       }
		    ],
			phone: [
		      {//第二种验证方式
		        required: true,
		         message: "请填写当前用户的手机号码！",
		         trigger: "blur"
		       },
		       {
		         pattern: /^(1[2-9][0-9])\d{8}$/,
		         message: "手机号码格式不正确！",
		         trigger: "blur"
		       }
		     ],
		  }	
	
	

验证正整数，上面那种也可以，注意初始化值

 seat: [
          {
            required:false,
            validator: (rule, value, callback) => {
              if (/^(?:[0-9]\d*)$/.test(value) == false) {
                callback(new Error("请输入正整数"));
              } else {
                callback();
              }
            },
            trigger: "change",
          },

        ]

这篇关于element 表单验证的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！