解决el-form表单校验时显示的红色星号与文字对齐的问题

1: 创作背景

在表单没有必填校验的时候也要和有校验的文字上下对齐

要右边这种 效果

2：思路

在label 前添加透明伪元素

3： 实现方式

   <el-form-item :label="$t('index.heJFXa6f')" prop="passWord" class="align-label">
        <el-input v-model="userInfo.passWord" type="password" />
     </el-form-item>


:deep(.align-label .el-form-item__label::before) {
  content: '*';
  color: transparent;
  margin-right: 4px;
}

首先在需要伪元素的el-form-item上添加类名

后面再style里写上面的样式就实现了！！

4：结束语

制作不易，点个赞再走吧