element-ui 给el-table添加支票；向表单嵌套对象添加复选框。

• 1.element-ui 给el-table添加校验
• 2.向表单嵌套对象添加复选框。
• • 2.1 表单校验和重置

1.element-ui 给el-table添加校验

1.列表部分

2.定义变量

     ruleForm: {
        tableData: [], //合同信息
     },
     //:rules="formRules.money"对应上述内容
     formRules: {
        money: [
          {
            required: true,
            message: "请选输入",
            trigger: "change",
          },
        ],
      },

//表单的ref="ruleForm"
preserveRuleForm() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
            //这是通过检查的代码。
        } else {
          console.log("error submit!!");
          return false;
        }
      });
},

css样式

2.向表单嵌套对象添加复选框。

      
        
          
             //prop="legalCases.code"
            
              
            
          
          
            
              
            
          
      
     

ruleForm: {
   legalCases: {
        code:"",
        name:"",
   }, 
},
//prop="legalCases.code"
formRules: {
        legalCases: {
          code: [
            { required: true, message: "不能为空", trigger: "blur" },
          ],
          name: [
            { required: true, message: "不能为空", trigger: "blur" },
          ],
        },
},

preserveRuleForm() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
            //这是通过检查的代码。
        } else {
          console.log("error submit!!");
          return false;
        }
      });
},

2.1 表单校验和重置

在el-form  中  ref="formref" :model="form" :rules="formRules"//这些是必要的，注意装订:model="form"，v-model无法工作

prop="keyWord" ,在 el-form-item 必须在中使用，而 keyWord 是在 form.keyWord

注意： form.keyWord 和 formRules.keyWord 必须统一
重置

prop="keyWord"//必须的,否则，重置将不起作用。

重置
 resetForm(formName) {
    this.$refs[formName].resetFields();
},

 var keyWord= (rule, value, callback) => {
      // console.log("value", value);
      if (value === "" || value == null) {
        callback();
      } else if (!/^(0|[1-9][0-9]*)+(.[0-9]{1,2})?$/.test(value)) {
        callback(new Error("请输入一个浮点数并保留两位小数。"));
      } else {
        callback();
      }
    };
 var mobilePhone = (rule, value, callback) => {
      if (value) {
        let mobile1 = /0d{2,3}-d{7,8}$/;
        let mobile2 = /[0][1-9][0-9]{9}$/;
        let tel = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
        if (tel.test(value) || mobile1.test(value) || mobile2.test(value)) {
          callback();
        }else{
          callback(new Error("请输入正确的联系信息"));
        }
      } else {
        callback();
      }
    };
return {
 formRules: {
        keyWord: [
          { validator: keyWord, required: false, trigger: "blur" },// required: false默认情况下，没有*
        ],
        ContentType: [
          { required: true, message: 请选择, trigger: blur },// required: true默认情况下，它是*
        ],
        mobilePhone : [
          { required: true, message: 请输入, trigger: blur }
        ],
      },
}