vue.js密码强度

<template>
  <div>
    <input type="password" v-model="password" @input="checkPasswordStrength" />
    <p>密码强度: {{ passwordStrength }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      password: '',
      passwordStrength: ''
    };
  },
  methods: {
    checkPasswordStrength() {
      const strongRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#\$%\^&\*])(?=.{8,})/;
      const mediumRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.{6,})/;

      if (strongRegex.test(this.password)) {
        this.passwordStrength = '强';
      } else if (mediumRegex.test(this.password)) {
        this.passwordStrength = '中等';
      } else {
        this.passwordStrength = '弱';
      }
    }
  }
};
</script>