<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
  }
}
相关推荐
linweidong1 小时前
C++ 模块化编程(Modules)在大规模系统中的实践难点?
linux·前端·c++
leobertlan5 小时前
2025年终总结
前端·后端·程序员
子兮曰5 小时前
OpenClaw架构揭秘:178k stars的个人AI助手如何用Gateway模式统一控制12+通讯频道
前端·javascript·github
Howrun7775 小时前
VSCode烦人的远程交互UI讲解
ide·vue.js·vscode
百锦再6 小时前
Reactive编程入门:Project Reactor 深度指南
前端·javascript·python·react.js·django·前端框架·reactjs
莲华君6 小时前
React快速上手:从零到项目实战
前端·reactjs教程
百锦再6 小时前
React编程高级主题:测试代码
android·前端·javascript·react.js·前端框架·reactjs
易安说AI6 小时前
Ralph Loop 让Claude无止尽干活的牛马...
前端·后端
颜酱7 小时前
图结构完全解析:从基础概念到遍历实现
javascript·后端·算法
失忆爆表症8 小时前
05_UI 组件库集成指南:Shadcn/ui + Tailwind CSS v4
前端·css·ui