elmentUI input框校验 只能输入0-10之间的正整数

你可以使用 Element UI 中的自定义校验规则来实现该需求，具体步骤如下：

1. 在 input 组件中添加 `v-model` 绑定值，例如 `v-model="inputValue"`。
2. 在 input 组件中添加 `:rules` 属性，并赋值为一个数组，例如 `:rules="[inputValueRule]"`。
3. 在 Vue 实例中定义 `inputValueRule` 规则函数，例如：

data() {
  return {
    inputValue: ''
  }
},
methods: {
  inputValueRule(rule, value, callback) {
    const reg = /^[1-9]$|^10$/;
    if (!reg.test(value)) {
      callback(new Error('请输入0-10之间的正整数'));
    } else {
      callback();
    }
  }
}

4. 在规则函数中，使用正则表达式判断输入值是否符合要求，如果不符合则调用 `callback` 回调函数返回错误信息，否则调用 `callback` 回调函数返回空值。

这样就可以实现 Element UI input 框只能输入 0-10 之间的正整数的校验。

相关问题

elmentUI input框使用oninput属性实现校验 只能输入0-10之间的正整数

可以使用 `oninput` 属性和正则表达式来实现校验。具体实现如下：

<el-input v-model="inputValue" placeholder="请输入0-10之间的正整数" @input="handleInput"></el-input>

data() {
  return {
    inputValue: '',
  };
},
methods: {
  handleInput() {
    // 过滤非数字字符
    this.inputValue = this.inputValue.replace(/[^\d]/g, '');
    // 转换为数字类型
    let value = parseInt(this.inputValue);
    // 判断是否为0-10之间的正整数
    if (value < 0 || value > 10 || isNaN(value)) {
      this.inputValue = '';
    }
  },
},

这里使用了 `replace` 函数过滤非数字字符，使用 `parseInt` 函数将输入值转换为数字类型，最后判断输入值是否为0-10之间的正整数，如果不是，则将输入框清空。