elementui输入框校验数字

在 Element UI 的输入框中，可以使用 `el-input-number` 组件来实现数字输入框，并且可以通过 `min`、`max`、`step` 等属性来限制输入数字的范围和步长。同时，也可以通过自定义校验函数来实现对输入数字的校验。

以下是一个示例代码：

<template>
  <el-input-number v-model="num" :min="0" :max="100" :step="10" :rules="rules"></el-input-number>
</template>

<script>
export default {
  data() {
    return {
      num: null,
      rules: [
        { 
          validator: (rule, value, callback) => {
            if (!Number.isInteger(value) || value < 0 || value > 100) {
              callback(new Error('请输入 0 到 100 之间的整数'));
            } else {
              callback();
            }
          },
          trigger: 'blur'
        }
      ]
    };
  }
};
</script>

在上面的代码中，我们通过 `:rules` 属性将校验规则传递给 `el-input-number` 组件。校验规则是一个数组，其中包含了一个对象，该对象包含了校验函数和校验触发时机。校验函数中通过 `Number.isInteger()` 方法判断输入值是否为整数，并且判断输入值是否在 0 到 100 之间。如果不符合条件，则通过 `callback(new Error('...'))` 方法返回错误信息，否则返回 `callback()` 表示校验通过。

需要注意的是，校验触发时机可以通过 `trigger` 属性来设置，该属性可以设置为 `blur`、`change` 或者 `input`，分别表示失焦、值改变和输入时触发校验。在上面的代码中，我们将触发时机设置为了失焦，即当输入框失去焦点时进行校验。