uniapp 密码支付，多样式支付，数字密码，支付密码，数字键盘，多样自定义支付组件，可以根据用户需求调节支付样式，总共八中组合满足大多数需求，真正的开箱即用
插件链接：https://ext.dcloud.net.cn/plugin?id=2591
作者说
开发不易，如果帮助到你的，请支持
有问题请留言，作者会积极更新
使用方法
# 基础用法
复制代码经典样式一马上去支付 import jpPwd from '@/components/jp-pwd/jp-pwd.vue';export default {components: {jpPwd},methods: {toOpen() {this.$refs.jpPwds.toOpen()},completed(e) {if (e == '123456') {this.$refs.jpPwds.toCancel()} else {this.pwd.msg = '密码错误'this.$refs.jpPwds.backs()}},forget() {console.log('忘记密码')}}}
复制代码import jpPwd from '@/components/jp-pwd/jp-pwd.vue';components: { jpPwd },
方法介绍
| 事件名 | 返回参数 | 说明 |
|---|---|---|
| @completed | 六位支付密码 | 密码输入完成后返回密码 |
| @forget | 忘记密码点击事件 | |
| @toCancel | 关闭输入框 | |
| @inputPwd | 当前输入的密码（一位） | 当前输入的密码，如用于密码错误后再次输入时清空密码提示语句 |
| 方法名 | 说明 |
|---|---|
| toOpen | 启用支付密码，用法（this.$refs.jpPwds.toOpen()） |
| backs | 清空密码 |
| toCancel | 关闭输入框 |
| 参数名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| payType | String | one | 支付样式（ one和two） |
| keyType | String | one | 键盘样式 |
| pawType | String | one | 输入框样式 |
| money | [String, Number] | 0 | 支付金额 |
| tite | String | 请输入支付密码 | 标题 （可以传入空值后标题不显示） |
| contents | String | 请输入支付密码 | 提示 （可以传入空值后提示不显示） |
| msg | String | 密码错误 | 密码错误提示语 （可以传入空值后密码错误提示语不显示） |
| forgetName | String | 忘记密码？ | 忘记密码 （可以传入空值后忘记密码不显示） |
| cancelType | Boolean | false | 是否输入完密码后消失 |
| keep | Boolean | false | 点击遮挡是否关闭 |
用户可以根据payType，keyType，pawType三个值传入的不同选择自己需要的支付样式，需要说明样式请自行探索
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！