在computed里写element表单校验规则

Question

如何在将element表单校验规则写在computed中的情况下
实现element表单校验

Answer 1

<el-form class="apply-form" :model="formData" :rules="rules" ref="form">
    <el-form-item label="坐标" prop="longitude">
        <el-input v-model="longitude" placeholder="请输入坐标" clearable></el-input>
    </el-form-item>
......
 
</el-form>

computed: {
    rules() {
      const checkEmail = () => (rule, value, callback) => {
        if (value) {
          var email = /^(\-|\+)?(((\d|[1-9]\d|1[0-7]\d|0{1,3})\.\d{0,8})|(\d|[1-9]\d|1[0-7]\d|0{1,3})|180\.0{0,8}|180)$/;
          if (email.test(value)) {
            return callback();
          } else {
            return callback("请输入正确的坐标");
          }
        } else {
          return callback("请输入X坐标");
        }
      };
      
      let rules = {
       
    
        workPeople: [
          { required: true, message: "请输入作业人", trigger: "change" },
        ],
       
        longitude: [
          { required: true, validator: checkEmail(), trigger: "change" },
        ],
        
        addselect: [
          { required: true, message: "请选择", trigger: ["blur", "change"] },
        ],
     
      };
      return rules;
    },
  },

参考一下