前言
在通过elementUI设计表单时，经常遇到输入框的数字校验操作。如何制定好rule规则对数字(整数和小数)进行校验，有时会是个比较棘手的问题。
问题
在最近工作中出现一个涉及input输入框数字校验的问题，绑定了rule规则，可是无论如何就是不生效。
现象如下：
rule规则代码片段如下：
detailTableRules: {
......
quantity: [{ required: true, type: 'integer', message: '请输入数字', trigger: 'blur'}]
}
如上所示，针对参数数量，制定了rule规则，但是即使输入了正确的整数，页面还是会有红框的错误提示，令人费解。
如何解决
通过网上搜寻，寻找到了解决方案：需要对数据进行一次转换。
elementUI 框架的表单验证用的async-validator，而async-validator支持一个转换方法，可以在验证前对校验的值做转换，而且这个转换并不会影响到表单绑定的源数据。
修改后的规则代码如下：通过transfrom方法进行数据的转换。
detailTableRules: {
......
quantity: [{ required: true, type: 'integer', message: '请输入数字', trigger: 'blur', transform(value) {
return Number(value)
} }]
}
