设置el-input 输入的位数

要限制 Element Plus 的 input 组件输入的位数，可以使用 `maxlength` 属性来设置最大输入长度。例如，如果你想限制输入长度为 10 位，可以这样设置：

<el-input v-model="inputValue" maxlength="10"></el-input>

在上面的代码中，`maxlength` 属性被设置为 `10`，这意味着用户在输入时只能输入最多 10 个字符。你可以根据自己的需要设置不同的最大输入长度。

另外，如果你想限制输入只能为数字，可以使用 `type` 属性将 input 的类型设置为 `number`。例如：

<el-input v-model="inputValue" maxlength="10" type="number"></el-input>

这将限制用户只能输入数字，并且最大长度为 10。

相关问题

el-input-number限制位数

可以通过设置 `min` 和 `max` 属性来限制 `el-input-number` 的取值范围。如果要限制位数，可以使用 `formatter` 和 `parser` 属性结合正则表达式来实现。

例如，如果要限制 `el-input-number` 的输入为最多两位小数，可以这样写：

<el-input-number v-model="num" :min="0" :max="100" :formatter="formatNum" :parser="parseNum"></el-input-number>

export default {
  data() {
    return {
      num: 0
    }
  },
  methods: {
    formatNum(value) {
      const reg = /^(\d+(\.\d{0,2})?)$/;
      return reg.test(value) ? value : '';
    },
    parseNum(value) {
      const reg = /^(\d+(\.\d{0,2})?)$/;
      const match = value.match(reg);
      return match ? match[1] : 0;
    }
  }
}

在上面的代码中，`formatter` 和 `parser` 属性分别指定了格式化函数和解析函数。`formatter` 函数会在显示数值时调用，它的返回值会作为 `el-input-number` 的显示值。在这个例子中，我们使用了一个正则表达式来限制小数位数不超过两位，如果输入的值不符合要求，就返回空字符串，这样 `el-input-number` 就不会显示错误的值了。

`parser` 函数会在用户输入时调用，它的返回值会作为 `el-input-number` 的实际值。在这个例子中，我们也使用了一个正则表达式来限制小数位数不超过两位，如果用户输入的值不符合要求，就返回 0，这样 `el-input-number` 就不会接受错误的输入了。

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的功能。