vue-cli 的表单验证有很多 这里我用的是element-ui
element-ui给出的示例中 自定义表单验证的 验证规则函数 写在data之内 return之前
如果表单验证很多 或者验证规则很长 将要自定义很多函数 页面看起来 冗杂
当其他页面 用到相同的表单验证 就得重新写/复制 一份 复用性不好 至于有没有其他解决方案 我不知道
我将其放到单独的一个表单验证 js中 export一下 页面直接 import引用即可
直接贴代码
其中html部分
js 部分
独立表单文件中规则的定义:
如上表单验证放在公共文件中 根据情况随用随取 页面也很清晰
附上效果图: