Vue密码验证:密码必须由大写字母、小写字母、数字、特殊符号中的2种及以上类型组成

Vue密码验证:密码必须由大写字母、小写字母、数字、特殊符号中的2种及以上类型组成

<template>
        <el-form :model="popData" size="mini" :rules="rules" ref="popData" style="padding: 0 30px 0 0;" label-width="110px"
          class="demo-ruleForm">
          <el-form-item label="登录名" prop="loginName">
            <el-input v-model="popData.loginName" placeholder="请输入登录名" type="text"></el-input>
          </el-form-item>
          <el-form-item label="密码" prop="password">
            <el-input v-model="popData.password" placeholder="请输入密码" type="text"></el-input>
          </el-form-item>
          </el-form>
   </template>

验证规则：

rules: {  
        loginName: [{
          required: true,
          message: '请输入登录名',
          trigger: 'change'
        }],
        password: [{
          required: true,
          message: '请输入密码',
          trigger: 'blur'
        },
        { min: 8, max: 15, message: '密码长度应大于等于8个字符小于16个字符!', trigger: "blur" },
      {
        trigger: 'blur',
        validator: (rule, value, callback) => {
          var passwordreg = /(?![A-Z]*$)(?![a-z]*$)(?![0-9]*$)(?![^a-zA-Z0-9]*$)/
          console.log(passwordreg.test(value))
          if (!passwordreg.test(value)) {
            callback(new Error('密码必须由大写字母、小写字母、数字、特殊符号中的2种及以上类型组成!'))
          }
          else{
            callback()
          }
        } },
       ],
       }