PasswordInput 密码输入框

专为电商支付、交易密码验证与隐私安全验证设计的连体密码格输入控件，可搭配自定义数字安全键盘或原生键盘使用。

---

代码示例

1. 基础 6 位支付密码 (Basic)

使用 v-model 绑定输入的密码字符串，默认 length="6" 位连体密码格。输入满格自动触发 @finish 事件。

<template>
  <mu-password-input v-model="password" :length="6" @finish="handleFinish" />
</template>

<script setup>
import { ref } from 'vue'
const password = ref('')
const handleFinish = (val) => {
  console.log('密码输入完成:', val)
}
</script>

---

2. 明文数字显示 (Mask False)

设置 :mask="false" 展示明文数字，取消黑点遮罩。

<template>
  <mu-password-input v-model="password" :length="6" :mask="false" />
</template>

---

3. 4 位短密码 (4 Digits)

设置 :length="4" 切换为 4 位短密码输入。

<template>
  <mu-password-input v-model="password" :length="4" />
</template>

---

API 属性说明 (Props)

参数名	说明	类型	可选值	默认值
v-model	当前输入的密码字符串	String	-	''
length	密码总位数	Number	-	6
mask	是否使用圆点黑点遮罩隐藏明文	Boolean	true | false	true
useSystemKeyboard	是否使用原生系统键盘 (若为 false 则调起自定义安全键盘)	Boolean	true | false	true

---

事件说明 (Events)

事件名	说明	回调参数
finish	输入达到 length 长度时触发	(value: String)
focus	聚焦输入框时触发	-
update:modelValue	双向绑定更改变	(value: String)