Блог

Привет, я пытаюсь использовать material-ui с обновлениями в проекте react.

Я пытаюсь перевести следующий css в jss.

 .recharts-wrapper .recharts-cartesian-grid-horizontal line:last-child {
    stroke-opacity: 0
}
  

Моя попытка:

 import createStyles from "@material-ui/core/styles/createStyles";

export const styles = () =>
  createStyles({
    root: {
      'recharts-wrapper': {
        'recharts-cartesian-grid-horizontal': {
          'line': {
            'amp;:last-child': {
              'stroke-opacity': 0
            }
          }
        }
      }
    }
  }
);
  

это не имеет никакого эффекта. Я вижу, что между и есть элемент с именем recharts-cartesian-grid recharts-wrapper recharts-cartesian-grid-horizontal , но я не уверен, что это имеет значение. Мои попытки переименовать классы в camel case не увенчались успехом как строки или не как строки.

Эффекта нет, потому что Recharts устанавливает непрозрачность штриха через атрибут style, который имеет более высокий приоритет, чем ваше определение стиля. Для переопределения вам нужно либо добавить !important , либо установить display: none вместо непрозрачности.