el-form-item标签必选项红色星号丢失

img

img

img

rules我也写了呀，怎么只是不能为空可以出现红色星号出现不了呢，而且还重叠，，

你prop传的不对吧改成：props试试，只有写死的不用加:。看你的写法应该是动态的吧，要不然直接就projectName。还有你这个rules写法我不太推荐其实可以直接给一个el-form加。单独加也没问题。你这个嵌套了两层。

https://element.eleme.cn/#/zh-CN/component/form#shu-zi-lei-xing-yan-zheng 看看文档里

红色 的星号 好像是由 required 属性决定的 单独加required 就会出现红色的星号 但没提示
红色 的提示是 rules的 正则等验证的提示
一般都是综合起来
{ required: true, message: '请输入活动名称', trigger: 'blur' },
required决定 星号提示[有] rules 的{ message: '请输入活动名称', trigger: 'blur' } 决定提示的需求
{ required: false, pattern:/^[0-9]+$ /,message: '请输入活动名称', trigger: 'blur' },
required决定 星号提示[没有] rules 的{ pattern:/^[0-9]+$ /,message: '请输入活动名称', trigger: 'blur' } 决定提示的需求 和验证规则


 <el-form ref="form" :model="form" :rules="rules" label-width="80px">
     <el-form-item label="姓名" prop="name">//注意这个  prop  这个name是需要和:rules="rules" 里面的 字段保持一致
          <el-input v-model="form.name"></el-input>
       </el-form-item>
       <el-form-item label="年龄" prop="age">
           <el-input v-model="form.age"></el-input>
        </el-form-item>
</el-form>

rules: {
        name: [
          { required: true, message: '请输入姓名', trigger: 'blur' },  //根据  form prop绑定的值来 添加 验证的功能   
          { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }//ui自带的一些简洁验证
        ],
        age: [
          { required: false,pattern:/^[0-9]+$] /, message: '请输入合法信息', trigger: 'blur' },//使用正则验证
        ]
      }


submitForm(formName) {
        //一定要执行this.$refs["form"].validate((valid) 不然是不会触发  验证的机制的    
        //this.$refs["form"] 的form 是你的<el-form ref="form" >中所绑定的  ref的值   他会去找这个 表单进行验证
        this.$refs["form"].validate((valid) => {
          if (valid) {
            alert('submit!');
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },

img