css - SASS 中的目标子类和元素？

Question

我有一个表格:

<form class="my-form">
  <input type="text" class="my-form__input">

我的 SASS 目前设置如下:

.my-form {
  // Some styles

  &__input {
    //Some styles
  }

  &__button {
    //Some styles
  }
}

但是，我想定位文本类型的输入并具有我的类，例如在 CSS 中:

input[type=text].my-form__input

有没有办法在保持上面的 SASS 结构的同时获得上面的 CSS 输出？

Answer 1

.my-form {
  // Some styles

  &__input {
    //Some styles

    &[type="text"] { // generates .my-form__input[type="text"]
      border: 2px solid red;
    }
  }

  &__button {
    //Some styles
  }
}