正常情况,输入了步长为1,是无法在输入小数的。需求是要能输入一位小数,但如果直接步长设为0.1,又不能按1这样递增,输入数量上用起来肯定很麻烦。
于是我就想了一个折中方法,步长设为:1.01,然后值改变的时候,change事件里,四舍五入,保留一位小数,这样就能实现点击输入框左右的加减 ,页面显示的就是按1的增长变化,手动输入的时候,又能输入小数。
以上思路,希望能给其他人带来帮助。
另一个问题:与上面无关
另外在做按0.5的倍数增长,step设为0.5,但是手动输入的值也要是0.5的倍数,如果不是,就在change事件里,ceil一下,这样做会有一个问题:
当 box 绑定的值已经是2了,这是change获得的值是1.3,向上取整,得到2,但是vue不会去渲染,因为值没变化,这个时候,需要使用nexttick更新值。

uniapp uni-number-box组件 步长为1,还能输入小数思路分享的更多相关文章

  1. rtvue-lowcode:一款基于uniapp框架和uview组件库的开源低代码开发平台

    rtvue-lowcode低代码开发平台 rtvue-lowcode一款基于uniapp框架和uview组件库的低代码开发平台,项目提供可视化拖拽编辑器,采用MIT开源协议,适用于app.小程序等项目 ...

  2. type为number的input标签输入小数的方法

    纠结了一段时间都没找出方法,最后灵光一现想出这个方法,没想到测试下果然成功了! 看目前网上几乎很难找到相对应的解决方法,所以这里分享出来,如果有更佳方法欢迎提出. 方法如下: <input ty ...

  3. input标签type为number时,输入小数,在Firefox浏览器上输入框标红的问题

    问题一:firefox 下 默认情况 <input   type="number"> 只允许输入整数,输入小数时会报错,输入框被标红 这时候可以添加参数 step=&q ...

  4. 基于uniapp自定义Navbar+Tabbar组件「兼容H5+小程序+App端Nvue」

    uni-app跨端自定义navbar+tabbar组件|沉浸式导航条|仿咸鱼凸起标签栏 在跨端项目开发中,uniapp是个不错的框架.采用vue.js和小程序语法结构,使得入门开发更容易.拥有非常丰富 ...

  5. 基于uni-app全端弹框组件uaPopup「兼容h5+小程序+app端|nvue」

    uniapp兼容多端自定义模态弹框组件UAPopup ua-popup 一款轻量级的uniapp自定义弹窗组件.汇集了android.ios和微信弹窗效果(msg消息.alert提示框.dialog对 ...

  6. uniapp自定义简单弹窗组件

    2.0(2019-08-31) 船新版本的信息弹窗组件 插件市场地址:http://ext.dcloud.net.cn/plugin?id=672 可以弹出很多条信息,并单独控制消失时间.点击消失. ...

  7. uni-app自定义Modal弹窗组件|仿ios、微信弹窗效果

    介绍 uniapp自定义弹窗组件uniPop,基于uni-app开发的自定义模态弹窗|msg信息框|alert对话框|confirm确认框|toast弱提示框 支持多种动画效果.多弹窗类型ios/an ...

  8. uni-app项目导入第三方组件库muse-ui

    你说uni-app是什么 我说,uni-app是一套基于vue.js开发跨平台应用的前端框架,可编译多个平台,比如:Android.IOS.H5.微信小程序.支付宝小程序.头条小程序.百度小程序 懂行 ...

  9. uniapp uni.navigateTo 传值传对象

    uni.navigateTo({ url: '/pages/details?obj='+ encodeURIComponent(JSON.stringify(item)) }); 接收: onLoad ...

  10. uniapp解决测评有组件导出风险,解决APP反编译,回编译后app无法打开的问题

    1.APP反编译 使用hbx云打包,打包出apk 拿到apk后,先下载反编译工具 https://pan.baidu.com/s/1A5D8x_pdSELlHYl-Wl6Xnw 提取码 6vzd 使用 ...

随机推荐

  1. Python调用动态库,获取BSTR字符串

    今天客户在用Python调用我们的动态库的时候,遇到一个问题,调用动态库中的函数,函数返回的是BSTR字符串,但是客户接收到的是一个8位长度的数字. 动态库函数原型:EXTERN_C BSTR ELO ...

  2. redis 简单整理——redis 的列表基本结构和命令[四]

    前言 简单整理一下redis的列表. 正文 列表(list)类型是用来存储多个有序的字符串,如图2-18所示,a. b.c.d.e五个元素从左到右组成了一个有序的列表,列表中的每个字符串 称为元素(e ...

  3. Java:使用POI和泛型生成excel表格

    首先创建一个maven项目,导入POI依赖包 <dependency> <groupId>org.apache.poi</groupId> <artifact ...

  4. 第四課-Channel Study File Reader & File Writer

    示例描述:从数据库中读取数据并过滤转换为HL7并存放到指定目录;然后读取目录中的HL7文件转换为txt文本并存放到指定目录. 首先在F:\MirthConnect\Test目录下创建Out目录存放输出 ...

  5. 阿里巴巴云数据仓库 MaxCompute 数据安全最佳实践

    ​简介:MaxCompute作为企业级SaaS模式云数据仓库,正在为客户业务及其数据提供持续的安全保护. MaxCompute 近期对产品的安全能力进行了全面升级 ,结合数据生命周期,针对数据误用.数 ...

  6. 大数据时代下,App数据隐私安全你真的了解么?

    ​简介:你是否有过这样的经历:你和朋友聊天表达你近期想要购买某件商品,第二天当你打开某购物软件时,平台向你推送的商品正是你想要购买的:或者,你是否接到过陌生来电,他们准确的报出了你的名字和年龄.... ...

  7. 庖丁解InnoDB之UNDO LOG

    ​简介: Undo Log是InnoDB十分重要的组成部分,它的作用横贯InnoDB中两个最主要的部分,并发控制(Concurrency Control)和故障恢复(Crash Recovery),I ...

  8. Git 版本控制:构建高效协作和开发流程的最佳实践

    引言 版本控制是开发中不可或缺的一部分,他允许多人同时协作,通过记录每一次代码的变更,帮助开发者理解何时.为什么以及谁做了修改.这不仅有助于错误追踪和功能回溯,还使得团队能够并行工作,通过分支管理实现 ...

  9. 记 dotnet 8.0.4 修复的 WPF 的触摸模块安全问题

    本文记录 dotnet 8.0.4 版本修复的 WPF 的触摸模块安全问题,此问题影响所有的 .NET 版本,修复方法是更新 SDK 和运行时 宣布安全漏洞地址: https://github.com ...

  10. async 与 promise 的区别

    async函数会引式返回一个promise,而promise的resolve值就是函数return的值 使用async和await明显节约了不少代码,不需要.then,不需要写匿名函数处理promis ...