<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
  }
}
相关推荐
顾安r10 分钟前
11.14 脚本网页 迷宫逃离
服务器·javascript·游戏·flask·html
顾安r44 分钟前
11.14 脚本网页游戏 猜黑红
前端·javascript·游戏·flask·html
码码哈哈0.01 小时前
Vue 3 + Vite 集成 Spring Boot 完整部署指南 - 前后端一体化打包方案
前端·vue.js·spring boot
@菜菜_达1 小时前
interact.js 前端拖拽插件
开发语言·前端·javascript
Baklib梅梅1 小时前
故事叙述的力量:用Baklib创作让内容更具温度与共鸣
前端·ruby on rails·前端框架·ruby
一个假的前端男2 小时前
uniapp 3端轮播
前端·javascript·uni-app
Fantasydg3 小时前
Request Response对象
前端
Wect3 小时前
学习React-DnD:核心组件与Hooks
前端
humors2213 小时前
前端开发案例(不定期更新)
前端·vue.js·elementui·ruoyi·若依
菠萝+冰3 小时前
npm中-d -g 和默认安装的区别
前端·npm·node.js