🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
mui提供了数字输入框控件,可直接输入数字,也可以点击“+”、“-”按钮变换当前数值;默认numbox控件dom结构比较简单,如下: ~~~ <div class="mui-numbox"> <!-- "-"按钮,点击可减小当前数值 --> <button class="mui-btn mui-numbox-btn-minus" type="button">-</button> <input class="mui-numbox-input" type="number" /> <!-- "+"按钮,点击可增大当前数值 --> <button class="mui-btn mui-numbox-btn-plus" type="button">+</button> </div> ~~~ 可通过data-*自定义属性设置数字输入框的参数,如下: ![](https://box.kancloud.cn/2016-07-18_578ce87d2f813.png) 示例:设置取值范围为0~100,每次变化步长为10,则代码如下 ~~~ <div class="mui-numbox" data-numbox-step='10' data-numbox-min='0' data-numbox-max='100'> <button class="mui-btn mui-numbox-btn-minus" type="button">-</button> <input class="mui-numbox-input" type="number" /> <button class="mui-btn mui-numbox-btn-plus" type="button">+</button> </div> ~~~