根据类名将pseoduclass修改为两个选项之一

Question

我想修改'button-transparent：before'属性，具体取决于按钮是否具有wishlist类。下面的sass似乎不起作用

<button
    className={classnames(
        'button--transparent',
        {'wishlist icon--heart-filled': props.wishlisted},
        {'icon--heart': !props.wishlisted},
    )}
    onClick={props.toggle}
>
    ...
</button>

SASS

.button--transparent {
  $color: initial;
  .wishlist & {
    $color: #EE4444;
  }

  &:before {
    color: $color !important
  }
}

Answer 1

如果你想在dom元素有类 $stateProvider .state('list', { url: "/", template: '<list-directive></list-directive>' }) .state('list.detail', { url: "/detail/{item_id}", template: '<detail-directive></detail-directive>' }) 和:before时应用.button--transparent伪元素，那么sass应该如下所示：

.wishlist