purchase-let/uni_modules/zy-passwordboard/readme.md

zy-passwordboard

密码弹框

兼容说明

仅基于H5进行了开发，未进行全面测试，后续用到再补

属性

属性名	类型	说明	默认值
visible	Boolean	是否显示（支持 v-model:visible）	false
random	Boolean	是否随机排位	true
num	Number	密码位数，过多显示会有问题	6
title	String	显示标题	--

事件

事件名	说明
complete	输入完毕
colse	关闭

样式说明

未使用 scoped, 通过顶层样式名.zy-passwordboard就可以进行调整。

使用案例

<script setup lang="ts">
import { ref } from 'vue';
import ZyPasswordboard from '@/uni_modules/zy-passwordboard/components/zy-passwordboard/zy-passwordboard.vue';
const passwordBoardVisible = ref(false);
const handleItemClick = () => {
	passwordBoardVisible.value = true;
};
const passwordBoardProps = {
	title: '输入支付密码',
	onComplete(value) {
		console.log(value);
	}
};
</script>
<template>
	<button @click="handleItemClick">开</button>
	<ZyPasswordboard v-model:visible="passwordBoardVisible" v-bind="passwordBoardProps" />
</template>