正常情况,输入了步长为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. 【FAQ】关于无法判断和区分用户与地图交互手势类型的解决办法

    一. 问题描述 当用户通过缩放手势.平移手势.倾斜手势和旋转手势与地图交互,控制地图移动改变其可见区域时,华为地图SDK没有提供直接获取用户手势类型的API. 二. 解决方案 华为地图SDK的地图相机 ...

  2. mybatis复习(二)

    简介 mybatis是一个优秀的基于 java 的持久层框架,它内部封装了 jdbc,使开发者只需要关注 sql语句本身, 而不需要花费精力去处理加载驱动.创建连接.创建 statement 等繁杂的 ...

  3. Sample上新,从API 8开始支持!速来拿走

    原文:https://mp.weixin.qq.com/s/TxUOSXySZRwQaECenxt-Og ,点击链接查看更多技术内容. 搭载API 8的新SDK已经发布.围绕着新SDK,官方贴心地输出 ...

  4. c# assembly.GetManifestResourceStream找不到路径

    前言 最近发现一个问题,用assembly.GetManifestResourceStream去找资源路径xml的时候,发现找不到,然后有些xml资源又可以找到,这时候有两种思维来思考. 正文 第一种 ...

  5. Django框架——路由分发、名称空间、虚拟环境、视图层三板斧、JsonResponse对象、request获取文件、FBV与CBV、CBV源码剖析、模版层

    路由分发 # Django支持每个应用都可以有自己独立的路由层.静态文件.模版层.基于该特性多人开发项目就可以完全解耦合,之后利用路由分发还可以整合到一起 多个应用都有很多路由与视图函数的对应关系 这 ...

  6. 力扣59(java)-螺旋矩阵Ⅱ(中等)

    题目: 给你一个正整数 n ,生成一个包含 1 到 n2 所有元素,且元素按顺时针顺序螺旋排列的 n x n 正方形矩阵 matrix . 输入:n = 3 输出:[[1,2,3],[8,9,4],[ ...

  7. 力扣121(java&python)-买卖股票的最佳时机(简单)

    题目: 给定一个数组 prices ,它的第 i 个元素 prices[i] 表示一支给定股票第 i 天的价格. 你只能选择 某一天 买入这只股票,并选择在 未来的某一个不同的日子 卖出该股票.设计一 ...

  8. HarmonyOS NEXT应用开发—城市选择案例

    介绍 本示例介绍城市选择场景的使用:通过AlphabetIndexer实现首字母快速定位城市的索引条导航. 效果图预览 使用说明 分两个功能 在搜索框中可以根据城市拼音模糊搜索出相近的城市,例如输入& ...

  9. 滴滴 Flink-1.10 升级之路

    简介: 滴滴实时计算引擎从 Flink-1.4 无缝升级到 Flink-1.10 版本,做到了完全对用户透明.并且在新版本的指标.调度.SQL 引擎等进行了一些优化,在性能和易用性上相较旧版本都有很大 ...

  10. 7张图揭晓RocketMQ存储设计的精髓

    ​简介: RocketMQ 作为一款基于磁盘存储的中间件,具有无限积压能力,并提供高吞吐.低延迟的服务能力,其最核心的部分必然是它优雅的存储设计. 存储概述 RocketMQ 存储的文件主要包括 Co ...