step属性对无效于货币输入，仅影响微调按钮行为，无法约束手动输入、粘贴或js赋值，且不处理舍入误差与格式化；应改用type="text"配合js正则校验、tofixed(2)格式化及事件拦截实现精确货币控制。
step 属性对 <input type="number"> 无效于货币输入
直接给 <input type="number"> 设置 step="0.01" 看似能控制最小变化单位，但实际在多数浏览器中——尤其是处理带小数的货币时——它只影响键盘上下箭头或点击微调按钮的行为，**完全不约束用户手动输入、粘贴或 JS 赋值**。更关键的是：step 不会自动格式化显示、不处理舍入误差（比如 0.1 + 0.2 !== 0.3），也不防止用户输 123.456 这类超精度值。
真正可控的货币最小单位靠 JavaScript 校验 + 格式化
必须放弃仅靠 HTML 属性实现“强制最小单位”的幻想。可行路径是：用 type="text" 避免浏览器 number 类型的不可控行为，再用 JS 拦截输入、限制小数位、四舍五入到分（即两位小数）。
- 监听
input事件，实时过滤非法字符（如字母、多个小数点） - 匹配数字+最多两位小数的正则，例如
/^\d+(\.\d{0,2})?$/ - 输入完成后，用
parseFloat(val).toFixed(2)强制保留两位，再转回字符串避免科学计数法 - 注意：不要用
Math.round(val * 100) / 100，它在浮点运算下可能出错（如1.005变成1）
step 在 type="number" 中的兼容性陷阱
即使坚持用 type="number"，step 的行为也极不稳定：
- Safari 对
step="0.01"支持差，微调按钮常跳1或忽略step - Chrome 允许输入任意精度值（如
12.345），step不触发校验 - 移动端软键盘可能弹出数字键盘但不带小数点，导致用户无法输入分
-
min和max与step组合时，若范围不能被 step 整除，部分浏览器会禁用微调按钮
推荐方案：隐藏原生 input，用自定义组件封装逻辑
最稳妥的做法不是修补 HTML 属性，而是封装一个轻量级货币输入组件：
- DOM 结构用
<input type="text">，禁用原生校验（novalidate） - 绑定
blur事件做最终归一化：去除空格、补零、toFixed(2)、检查是否为空或负数 - 显示层可加前缀
¥或后缀元，但 value 始终存纯数字字符串（如"12.34"） - 对外暴露
getValue()方法返回number类型（parseFloat(val)），内部存储始终为两位小数字符串
别指望一个 step 属性搞定货币精度——它连小数点都管不住，真正的控制权在 JS 的正则、toFixed 和事件拦截手里。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
