Element UI数字组件四舍五入问题及居右显示

本文介绍了如何使用`el-input-number`组件实现数字输入的四舍五入和整数截取,并展示了如何通过CSS实现文本右对齐显示。在处理用户输入时,通过监听`@input.native`事件,结合`parseInt`方法动态调整数值精度。同时,提供了CSS样式`.text-right.el-input__inner`来轻松达成居右显示的效果。
摘要由CSDN通过智能技术生成

1.数字组件会自动进行四舍五入,通过以下方法,可以直接进行位数的截取。

<el-input-number v-model="vv" controls-position="right" :precision="0" :step="1" :max="99999"" size="mini" @@input.native="changeInputPt($event,0)"></el-input-number>
            changeInputPt(e, count) {
                //count为保留小数的位数,0为取整。
                if (e.target.value == "") {
                    e.target.value = 0;
                    return;
                }

                if (count == 0) {
                    e.target.value = parseInt(e.target.value);
                }
                else {
                    if ((e.target.value.indexOf('.') >= 0)) {
                        e.target.value = e.target.value.substring(0, e.target.value.indexOf('.') + (count + 1));
                    }
                }
            },

2.居右显示,设置样式就可以。

.text-right .el-input__inner {
    text-align: right !important;
}

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值