更新记录

1.0.0(2022-05-30)

1.增加6位密码输入框 2.增加4位验证码输入框 3.支持设置边框颜色 4.支持修改文字颜色 5.支持修改字体大小 6.支持设置输入框宽度


平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.2.0 app-vue app-nvue × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × ×

本组件使用vue3+ts开发,vue3中可以使用,vue2不可以使用

基础用法

参数说明 Props 类型 是否必填 默认值 说明
width string 或 number 484 输入框的总宽度
borderColor string 或‘none’ ‘#4db686’ 边框颜色
fontSize string 或 number ‘30’ 字体大小
borderRadius string 或 number 0 输入框整体圆角弧度
color string #000 字体颜色
numbers 4或6 6 4是验证码框,6是密码框
@finalValue 自定义事件 输入框填满时,触发事件,值是当前输入框内的值

支付密码框效果 6位数验密码 4位验证码效果

示例代码

<template>
    <xt-password-box @finalValue="getValue">
</template>

<script lang="ts" setup>

const getValue = (value: string) => {
  console.log(value)
}

</script>

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问