uni-app NumberBox 数字输入框简单使用方法

链接:https://pan.baidu.com/s/1WXRxsIIegpMo-6Sp8ZX5bw
提取码:nxzb
复制这段内容后打开百度网盘手机App,操作更方便哦.
官方的最新源码,change的bug已经解决了。
老版本文档:https://ext.dcloud.net.cn/plugin?id=31
1.简单介绍一下本人的用法.

修改插件uni-number-box.vue第44行代码,修改为:
this.$emit(‘input’, newVal)

<template>
<uni-number-box v-model="numberValue" @input="bindChange" />
</template>
<script>
		import uniNumberBox from "@/components/uni-number-box/uni-number-box.vue"
		export default {
		components: {uniNumberBox},
		data() {
			return {
				numberValue:1,
			}
	},
	methods: {
				bindChange(value){
				console.log(value)
			}
	}
}
</script>

以上为基本用法,我们来分析一些这个组件的源码:
未发生变化的地方:在这里插入图片描述
默认值还是1,最小值为1,最大值为100.可以设置禁用状态.
比较第老版本的变化:
在这里插入图片描述
使用变量newVal,和oldVal 来控制页面的最后显示,及设置值。

评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值