饿了么 elemens 中 form 组件，怎样去掉前面的 红色 “ * ”，又保持对输入框的非空检查呢

Question

饿了么组件地址

文字前面的红色“*”是由 required = true 去控制的，当把它改成false时，非空检查就失效了，应该怎样两者兼顾呢？

Answer 1

偷懶一點使用覆蓋class的方式,改label前的偽元素
`.el-form-item.is-required .el-form-item__label:before{
content:"";
}`

Answer 2

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

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

}
将他的css覆盖掉

Answer 3

这种情况下只能修改源码，

element-ui的 css文件 (index.css) 删掉下面这几句。

Answer 4

最简单的可以保持require:true，然后修改样式。另一种是修改为require:false，再自己写验证:

validator: function(rule, value, cb){
    if(value === ' '){
        cb(new Error('请输入完整'));
    } else {
        cb();
    }
}

Answer 5

不是有自定义规则么

Answer 6

1.把requir额改为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)
      };