element ui input框 非空验证和只能输入数字校验

Element UI 提供了一个名为 `el-form` 的表单组件套件，其中包括 `el-input` 输入框，可以方便地添加验证功能。对于非空验证和数字输入校验，你可以这样做：

1. **非空验证**：
使用 `v-model` 绑定值，并在 `rules` 属性里设置验证规则，比如：

   <el-form-item label="必填字段">
     <el-input v-model="requiredField" placeholder="请输入内容"></el-input>
     <el-form-item-explain :show="!requiredField">此项不能为空</el-form-item-explain>
   </el-form-item>

然后在数据对象中声明这个字段并配置其是否必填：

   data() {
     return {
       requiredField: ''
     },
   },
   methods: {
     validateRequired() {
       this.$refs['requiredField'].$validate();
     }
   }

当输入为空时，`validateRequired` 方法会被触发，显示错误提示。

2. **只允许输入数字的验证**：
可以借助 Vue 的 `input` 事件监听输入变化，然后检查输入的内容是否全为数字：

   <el-input type="number" v-model.number="numericField" @input="checkNumericInput"></el-input>

   methods: {
     checkNumericInput(e) {
       if (!/^\d*$/.test(e.target.value)) { // 使用正则表达式检查是否全为数字
         e.target.value = e.target.value.slice(0, -1); // 清除非数字字符
       }
     }
   }

如果用户输入了非数字字符，`checkNumericInput` 方法会清除该字符。