直接上代码
<el-form-item label=" " prop="phone" :rules="checkPhone"> <el-input v-model="modelForm.phone" placeholder="请输入手机号" > <template slot="prepend">手机号</template> </el-input> </el-form-item>
<el-form-item label=" " prop="email" :rules="checkEmail"> <el-input v-model="modelForm.email" placeholder="请输入邮箱" > <template slot="prepend">邮箱</template> </el-input> </el-form-item>
data() { var checkOnePhone = (rule, value, callback) => { if (value && value != "") { if (!/^1(3|4|5|6|7|8|9)d{9}$/.test(value)) { callback(new Error("请输入正确的手机号")); } else { callback(); } } else { callback(); } }; var checkEmail = (rule, value, callback) => { if (value && value != "") { if ( !/^([a-zA-Z0-9]+[_|\_|.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|.]?)*[a-zA-Z0-9]+.[a-zA-Z]{2,3}$/.test( value ) ) { callback(new Error("请输入正确的邮箱")); } else { callback(); } } else { callback(); } }; return {...
checkPhone: [
{ required: true, validator: checkOnePhone, trigger: "blur" }
],
checkEmail: [{ required: true, validator: checkEmail, trigger: "blur" }],
....
}}