CSS 模块：&.className

Question

是否可以使用CSS Modules做这样的事情？

CSS

.dateLabel {
  text-align: center;

  &.today {
    background: red;
  }
}

JS

import s from './style.scss';

return (
    <div class={`today ${s.dateLabel}`}>
     ...         
);

因为我想避免这样做：

.dateLabel {
  text-align: center;
}

.today {
  background: red;
}

JS

import s from './style.scss';

return (
    <div class={`${s.today} ${s.dateLabel}`}>
     ...         
);

Answer 1

您可以使用sass Ampersnad来实现此目的。

https://css-tricks.com/the-sass-ampersand/