ElementUI表单的自定义校验规则_elementui表单自定义验证

---

前言

使用Vue做后台管理系统绕不开的一个框架就是ElementUI，而做后台管理系统，经常会遇见的就是对表单进行规则校验，从而减少不必要的Ajax请求。很多时候ElementUI提供的基础校验没有办法达到我们的需求，这时候就需要我们自定义校验规则。那么就来看看使用ElementUI提供的表单时如何自定义校验规则吧。

---

一、如何自定义校验规则？

官网：ElementUI

代码如下（示例）：

为了统一管理，在src/utils目录下，新建validate.js文件，写一个校验手机号的规则，并将其导出。

export function validMobile(str) {
   
  return /^1[3-9]\d{9}$/.test(str) // 校验手机号
}
1
2
3
4

将写好的校验规则在.vue结尾的组件中导入使用。

<template>
  <div class="login_setting_container"
1