element ui cascading selector adds required validation

cascadeValue: [
  {required: true, type:'array', message: "cannot be empty", trigger: "change"}
],

Add mandatory validation to the cascade selector through the above method, even if the content is selected, it will always prompt that it cannot be empty

 This verification method does not pass. Another way is to add verification by adding custom verification rules.

cascadeValue:[
  {validator:validCascader, trigger: "change"}
],

var validCascader = (rule, value, callback) => {
  if (this.cascadeValue.length == 0) {
    callback(new Error('cannot be empty'))
  } else {
    callback();
  }
};

The required red asterisk is added through css

.cascade_box {
  .el-form-item__label:before {
    content: "*";
    color: #ff4949;
    margin-right: 4px;
  }
}

Guess you like

Origin blog.csdn.net/workhard0905/article/details/121553389