<el-input-number>显示两位数字;如果是一位数字的话前面补0

可以通过自定义 formatter 函数来实现。具体步骤如下:

  1. 在 <el-input-number> 上添加 :formatter 属性,值为 formatter 函数名。

  2. 在 methods 中定义 formatter 函数,该函数接收一个参数 value,表示当前输入框中的值。

  3. 在 formatter 函数中,先将 value 转化为字符串形式,然后判断字符串长度是否为 1,如果是,则在字符串前面添加一个 0。

  4. 最后返回处理后的字符串即可。

代码示例:

复制代码
<el-input-number :formatter="formatNumber"></el-input-number>

methods: {
  formatNumber(value) {
    let str = value.toString()
    if (str.length === 1) {
      str = '0' + str
    }
    return str
  }
}
相关推荐
代码游侠几秒前
应用——Linux 标准IO编程
linux·前端·数据库·学习·算法
用户99045017780097 分钟前
微信红包封面制作redbag-cover
前端
2401_860494707 分钟前
在React Native中开发进度条组件,可以使用多种方式来实现,包括使用内置的`ProgressViewharmony`(仅限harmony)
javascript·react native·react.js
一人の梅雨13 分钟前
淘宝商品详情接口深度解析:从 Sign 签名动态生成到多端数据全息重构
开发语言·javascript·重构
christine-rr13 分钟前
windows系统上node.js安装配置教程
前端·windows·npm·node.js
海上彼尚15 分钟前
React18+快速入门 - 1.响应式机制之 useState 和 useReducer
前端·javascript·react.js
Chennnng15 分钟前
键盘参数选购
前端·css·计算机外设
Nan_Shu_61416 分钟前
熟悉RuoYi-Vue-Plus-前端 (3)
前端·javascript·vue.js
b***748819 分钟前
前端技术的加速变革:从工程体系到智能化时代的全栈重构
前端·重构
NOVAnet202319 分钟前
React曝“炸弹级”漏洞(CVE-2025-55182),CVSS 10.0分!已有在野利用,企业如何紧急防御
前端·react.js·网络安全·前端框架