el-input输入数字自动填充小数点位数的0

您可以使用 `toFixed()` 方法来控制小数点后的位数，并结合 `@blur` 事件来处理自动填充小数点后的0。示例代码如下：

<el-input v-model="num" @blur="handleBlur"></el-input>

methods: {
  handleBlur() {
    if (this.num !== '') {
      this.num = Number(this.num).toFixed(2);
    }
  }
}

在上面的代码中，我们监听了 `@blur` 事件，当输入框失去焦点时，会触发 `handleBlur` 方法。在该方法中，我们首先判断输入框中是否有值，如果有值，就将其转换为数字类型，并使用 `toFixed()` 方法来设置小数点后的位数为2位。最后，将处理后的值赋值回输入框的 `v-model` 中，完成自动填充小数点位数的0的功能。

相关问题

el-input 只能输入数字和小数点

可以通过设置 el-input 的属性，限制只能输入数字和小数点。可以使用 v-model 绑定输入的值，使用正则表达式限制输入内容。

例如，设置 el-input 只能输入数字和小数点，可以在 el-input 中添加如下属性：

<el-input v-model="number" :oninput="handleInput" placeholder="请输入数字和小数点" :maxlength="10" :pattern="numberPattern"></el-input>

其中，number 是绑定的值，handleInput 是输入框的事件处理函数，maxlength 是最大长度，numberPattern 是正则表达式，用于限制输入内容。

在 Vue 中，可以定义一个 data 属性 number 和一个方法 handleInput，用于处理输入事件：

export default {
  data() {
    return {
      number: '',
      numberPattern: /^[0-9.]*$/
    }
  },
  methods: {
    handleInput() {
      this.number = this.number.replace(/[^\d.]/g, '') // 只保留数字和小数点
    }
  }
}

这样，就可以限制 el-input 只能输入数字和小数点了。

el-input 只能输入数字和小数点后一位

可以通过监听输入事件，在输入内容不符合要求时，阻止输入或者修改输入内容，来实现只能输入数字和小数点后一位的功能。具体实现如下：

1. 在 el-input 上绑定输入事件，如下所示：

<el-input v-model="inputValue" @input="handleInput"></el-input>

2. 在 Vue 实例中定义 `handleInput` 方法，该方法会在 el-input 的输入事件触发时被调用，如下所示：

methods: {
  handleInput (event) {
    let inputValue = event.target.value
    // 输入内容只能是数字和小数点
    if (/[^0-9\.]/g.test(inputValue)) {
      event.preventDefault()
      // 如果输入内容不符合要求，则清空输入框
      this.inputValue = this.inputValue.replace(/[^0-9\.]/g, '')
    }
    // 小数点后只能有一位
    if (/\.\d{2,}/.test(inputValue)) {
      event.preventDefault()
      // 如果小数点后有多于一位，则截取小数点后一位
      this.inputValue = this.inputValue.replace(/(\.\d{1})\d+$/, '$1')
    }
  }
}

在 `handleInput` 方法中，首先判断输入内容是否符合要求，如果不符合要求，则阻止输入，并清空输入框。然后判断小数点后是否有多于一位，如果有，则截取小数点后一位。最后，将修改后的输入值赋值给 `inputValue`，即可实现只能输入数字和小数点后一位的功能。