el-input输入框必须是四位数字

问:

<el-form-item
        prop="adId"
        label="广告ID"
        :rules="{
          required: true, message: '广告ID不能为空', trigger: 'blur'
        }"
      >
        <el-input
          v-if="!currentItem.id"
          v-model.trim="addDataForm.adId"
          @blur="trimEmail('adId')"
          placeholder="必填"
        ></el-input>
        <el-input
          v-else
          v-model.trim="addDataForm.adId"
          @blur="trimEmail('adId')"
          placeholder="必填"
        ></el-input>
      </el-form-item>现在我希望输入框必须是四位数字

回答:

如果你希望输入框必须是四位数字，你可以在验证规则中添加一个正则表达式来实现。下面是一个在Vue.js中使用Element UI的<el-form>和<el-input>来实现输入框必须是四位数字的示例代码：

<el-form-item
  prop="adId"
  label="广告ID"
  :rules="[
    { required: true, message: '广告ID不能为空', trigger: 'blur' },
    { pattern: /^[0-9]{4}$/, message: '请输入四位数字', trigger: 'blur' }
  ]"
>
  <el-input
    v-if="!currentItem.id"
    v-model.trim="addDataForm.adId"
    @blur="trimEmail('adId')"
    placeholder="必填"
  ></el-input>
  <el-input
    v-else
    v-model.trim="addDataForm.adId"
    @blur="trimEmail('adId')"
    placeholder="必填"
  ></el-input>
</el-form-item>