如何在这个less（css）代码中捕获PSEDOO类之外的额外css类？

它是我现有的

less

代码：

  .my-form {
    .form-control {
      &:focus {
        border-color: blue;
      }
  }

每当获得焦点时，它会将

.form control

的边框颜色设置为蓝色

现在，除了焦点事件之外，当“.my form”元素有一个额外的类“active”时，我想将边框颜色设置为蓝色

我可以重复一遍，但这并不理想：

  .my-form {
    .form-control {
      &:focus {
        border-color: blue;
      }
  }

  .my-form.active {
    .form-control {
        border-color: blue;
      }
   }

但这显然不起作用：

  .my-form {
    .form-control {
      &:focus,
      & .active {
        border-color: blue;
      }
  }

---

我想我可以定义一个函数来设置边框颜色。但有什么方法可以让我更简洁地表达这一点吗？希望它可以位于

&:focus

选择器旁边。

我想您要做的是：

.my-form {
   .form-control {
      &:focus, .active& {
        border-color: blue;
      }
   }
}

.active&

将输出

.active.my form.form控件

.active&

将输出

.my-form.active.form控件