element表单验证的封装

前言

这一篇文章是在用element中的表单的时候,会用到正则来判断表单的对错,当然正则的话得自己写,比如这样element表单验证的封装
但是我们开发的时候就会发现如果两个组件都用到了这个正则那么就会产生重复性,这还只是两个,一般的话不止两个,会有很多,会产生很多的重复的正则,那么,就很烦,因为我们是要追求优雅,简介的,诶,碰到我了,那么就很简单的解决了。

1、创建一个js文件

创建一个js文件,我是习惯性创建到assets中,这个没有什么规定的,然后就在里面写正则,就是按这样的来,因为我们是用的人家element的东西,所以得规规矩矩
element表单验证的封装

2、在main.js中挂载

element表单验证的封装

3、在组件中的使用

使用element表单验证的时候会有rules这个东西,大家应该都不陌生,我直接上图了
element表单验证的封装
element表单验证的封装
这个主要就是针对自定义的正则 就是 validator的值,这样把this.formValidation后面的值对上就可以了,这就完事了。

结语

这篇文章如果有啥不清晰的地方或者是没明白的地方,就在下方留言就可以了,我是每天都会看的呐。