很多時候都會用表單中輸入正整數的情況,在element ui中可以用el-input-number 標簽來顯示輸入框是number類型的,或者type="number"也可以的,但是正整數就需要判斷了
可以利用正則來判斷
代碼如下
<el-form ref="checkData" :rules="checkData" :model="eyPara" label-position="left" label-width="100px">
<el-form-item label="值:" prop="amErrYear">
<el-input v-model="eyPara.amErrYear" placeholder="輸入值" clearable/>
</el-form-item>
</el-form>
export default{
data(){
const blurText = async(rule, value, callback) => {
// const reg = /^\-\d\.?\d*$/
// const boolean = reg.test(value)
const boolean = new RegExp('^[1-9][0-9]*$').test(value)
// console.log(boolean)
if (!boolean) {
this.$message.warning('請輸入正整數')
this.eyPara.amErrYear = ''
}
}
return {
eyPara: {
amErrYear: ''
},
checkData:{
amErrYear: [
{ required: true, message: '輸入值', trigger: 'blur' },
{ validator: blurText, trigger: 'blur' } //表單驗證的時候會調用的方法
],
}
}
}
}
rules表單驗證規則,異步表單驗證,validator 是根據校驗規則得到的校驗器 ,自定義校驗 callback 必須被調用。 更多高級用法可參考
async-validator。