The el-form regular check in elementUI checks positive integers

Vue uses element el-form to authenticate positive integers

<template>
  <div>
    <el-form
      ref="phoneDialogForm"
      :rules="rules"
      :model="phoneData"
      label-position="right"
      label-width="100px"
    >
      <el-form-item label="正整数认证" prop="phone" style="width: 300px">
        <el-input v-model="phoneData.phone" maxlength="11" />
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
    
    
  data() {
    
    
    return {
    
    
      phoneData: {
    
    
        sendcode: "",
      },
      rules: {
    
    
        phone: [
          {
    
    
            validator: (rule, value, callback) => {
    
    
              if (/^(?:[1-9]\d*|0)$/.test(value) == false) {
    
    
                callback(new Error("请输入正整数"));
              } else {
    
    
                callback();
              }
            },
            trigger: "change",
          },
        ],
        code: [{
    
     required: true, message: "请输入验证码", trigger: "blur" }],
      },
    };
  },
  created() {
    
    },
  methods: {
    
    },
};
</script>

Guess you like

Origin blog.csdn.net/weixin_46476460/article/details/111536864