el-input num自定义验证

<!-- el-input  表单验证 -->
<el-form :model="numberValidateForm" ref="numberValidateForm" :rules="rules" label-width="100px" class="demo-ruleForm">
  <el-form-item
    label="年龄"
    prop="age"
  >
    <el-input type="age" v-model="numberValidateForm.age" autocomplete="off"></el-input>
  </el-form-item>
  <el-form-item>
    <el-button type="primary" @click="submitForm('numberValidateForm')">提交</el-button>
    <el-button @click="resetForm('numberValidateForm')">重置</el-button>
  </el-form-item>
  <el-form-item>
    <el-input> </el-input>
  </el-form-item>
</el-form>
-----------------------------
    data:function() {
     var checkNum = function(rule,value,callback){
      if (!value) {
          return callback(new Error('年龄不能为空'));
        }
        setTimeout(function() {
          if (!Number.isInteger(value)) {
            callback(new Error('请输入数字值'));
          } else {
            callback();
          }
        }, 500);
     }
      return {
        numberValidateForm: {
          age: ''
        },
rules:{
  age: [ { validator: checkNum, trigger: 'blur' }]
}
      }
    },


-------------------------------
 submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            alert('submit!');
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      },
headerCellClass(row){
   if (row.columnIndex === 0) { // 第三列表头加 class, 用样式去隐藏
      return 'hide';
   }
},

一开始使用v-model.number 绑定 输入字符过多时,双向绑定出现数值错误,应该是18 位左右,沙比测试天天啥也不干,就jb瞎点,能用不就行了,逼逼赖赖的

可以限制字符串长度,但自己写文字提示太麻烦,样式不统一

自己项目用户浏览器版本低的一笔,箭头函数不适用,其他需要补充的逻辑可以接着上面写 ,哦了