el-input 手机号正则校验

根据提供的引用内容，el-input的手机号正则校验可以通过在Vue的data中定义一个phoneNumber的验证函数，并在rules中使用该验证函数进行校验。具体的实现步骤如下：

1. 在Vue的data中定义一个phoneNumber的验证函数，该函数接收三个参数：rule, value, callback。其中，rule是验证规则，value是输入的手机号码，callback是回调函数。
2. 在phoneNumber函数中，使用正则表达式对手机号进行验证。如果手机号为空，则通过callback函数返回一个错误信息，提示用户输入手机号。如果手机号不符合正则表达式的规则，则同样通过callback函数返回一个错误信息，提示用户输入正确的手机号。如果手机号符合正则表达式的规则，则通过callback函数返回一个空值，表示验证通过。
3. 在Vue的rules中，对phone字段进行校验。使用validator属性指定phoneNumber函数作为验证函数，并设置message属性为"请输入正确的手机号"，trigger属性为"blur"，表示在失去焦点时进行校验。
4. 在el-input组件中，使用v-model指令绑定ruleForm.phone字段，将输入的手机号码与Vue的data中的phone字段进行双向绑定。
5. 在el-form组件中，使用:rules属性将rules绑定到el-form组件上，实现手机号的正则校验。

综上所述，可以通过以上步骤实现el-input的手机号正则校验。
#### 引用[.reference_title]
- *1* *2* [el-form-item中的el-input加上正则校验](https://blog.csdn.net/m0_58266149/article/details/126954372)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
- *3* [el-input手机号，座机号，邮箱，银行卡，邮编，传真验证](https://blog.csdn.net/csdnyp/article/details/118762677)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]