Slack Off changes the class element before label to
`.el-form-item.is-required .el-form-item__label:before {
content: ";
} `

.el-form-item.is-required:not (.is-no-asterisk) > .el-form-item__label:before {

content: '';
width: 0px;
margin-right: 0px;

}
overwrite his css

in this case, you can only modify the source code,

element-ui.

the easiest thing to do is to keep the require:true, and then modify the style. The other is to change it to require:false, and then write the verification yourself:

validator: function(rule, value, cb){
    if(value === ' '){
        cb(new Error(''));
    } else {
        cb();
    }
}

isn't there a custom rule

1. Change the requir amount to false
phone: [

        {required: false, validator: checkPhone, trigger: 'blur' }
      ],

2.(data,return)

export default {
name: "Order",
data () {

// 
    var checkPhone = (rule, value, callback) => {
        const phoneReg = /^1[3|4|5|6|7|8][0-9]{9}$/
        if (!value) {
          return callback(new Error(''))
        }
        setTimeout(() => {
          
          if (!Number.isInteger(+value)) {
            callback(new Error(''))
          } else {
            if (phoneReg.test(value)) {
              callback()
            } else {
              callback(new Error(''))
            }
          }
        }, 100)
      };