报错提示：reg.test is not a function

最新推荐文章于 2023-03-13 22:20:09 发布

韶光鸭

最新推荐文章于 2023-03-13 22:20:09 发布

阅读量1.1k

点赞数 1

文章标签：前端开发表单验证正则表达式密码安全 Element UI

本文链接：https://blog.csdn.net/weixin_48667689/article/details/126010387

版权

今天写自定义验证时发现报错。

var regexp = "/^(?!\D+$)(?![^a-zA-Z]+$)\S{6,20}$/"

在这里插入图片描述

修改后：

var regexp = /^(?!\D+$)(?![^a-zA-Z]+$)\S{6,20}$/

最终element自定义验证：

  <el-row>
    <el-col :span="10">
      <el-form-item label="新密码" prop="newPassword">
        <el-input v-model="rentRefundForm.newPassword" placeholder="数字、小写字母、大写字母、至少包含两种，6-20位" style="width:100%" />
      </el-form-item>
    </el-col>
  </el-row>
  <el-row>
    <el-col :span="10">
      <el-form-item label="确认密码" prop="aginPassword">
        <el-input v-model="rentRefundForm.aginPassword" placeholder="数字、小写字母、大写字母、至少包含两种，6-20位" style="width:100%" />
      </el-form-item>
    </el-col>
  </el-row>

js部分：

  var regexp = /^(?!\D+$)(?![^a-zA-Z]+$)\S{6,20}$/; //正则表达式
    var newPasswordVal = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请输入新密码'));
      } else if (!regexp.test(value)) {
        callback(new Error("数字、小写字母、大写字母、至少包含两种，6-20位"));
      } else {
        callback();
      }
    }
    var aginPasswordVal = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请再次输入新密码'));
      } else if (!regexp.test(value)) {
        callback(new Error("数字、小写字母、大写字母、至少包含两种，6-20位"));
      } else if (value !== this.rentRefundForm.newPassword) {
        callback(new Error('两次输入密码不一致!'));
      } else {
        callback();
      }

data中：

   rentRefundForm: {
      newPassword: "",
      aginPassword: "", // 再次确认密码
    },
  rules: {
    newPassword: [
      { required: true, validator: newPasswordVal, trigger: 'blur' },
    ],
    aginPassword: [
      { required: true, validator: aginPasswordVal, trigger: 'blur' },
    ],
  }