StrengthMeter
用于校验密码强度
Usage
<template> <div class="p-4 flex justify-center"> <div class="demo-wrap p-10"> <StrengthMeter placeholder="默认" /> <StrengthMeter placeholder="禁用" disabled /> <br /> <StrengthMeter placeholder="隐藏input" :show-input="false" value="!@#qwe12345" /> </div> </div></template>
<script lang="ts"> import { defineComponent } from 'vue'; import StrengthMeter from '/@/components/StrengthMeter/index'; export default defineComponent({ components: { StrengthMeter, }, });</script><style lang="less" scoped> .demo-wrap { width: 50%; background: #fff; border-radius: 10px; }</style>Props
| 属性 | 类型 | 默认值 | 可选值 | 说明 |
|---|---|---|---|---|
| value | string | - | - | 校验的值 |
| showInput | boolean | true | - | 是否显示 input |
| disabled | boolean | false | - | 是否禁用 |
Events
| 事件 | 回调参数 | 说明 |
|---|---|---|
| score-change | number | 强度值改变触发 |
| change | string | input 值改变触发 |