element 表单验证

发布时间:2022-06-28 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了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 表单验证全部内容,希望文章能够帮你解决element 表单验证所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: