React-jss: Предупреждение: правило не привязано. Ссылка на параметр отсутствующего листа: true

Я пытаюсь изменить цвет границы подчеркивания входного компонента Material-UI. Но следующий код не работает и выдает следующую ошибку:

Предупреждение: Правило не привязано. Отсутствует параметр листа "ссылка: правда"

Это мой импорт:

import React from "react";
import classNames from "classnames";
import PropTypes from "prop-types";
import injectSheet from "react-jss";
import customInputStyle from "../../assets/jss/material-dashboard-react/components/customInputStyle.jsx";

Это объединенные имена классов:

  const underlineClasses = classNames({
    [classes.underlineError]: error,
    [classes.underlineSuccess]: success && !error,
    [classes.underlineCustom]: customColor,
    [classes.underline]: true
  });

Если ошибка или успешные реквизиты верны, он показывает правильный цвет. Я хочу установить цвет подчеркивания на основе свойства customColor, если он определен, поэтому я не могу определить статический цвет.

Это компонент, который использует объединенные имена классов:

  <Input
    classes={{
      underline: underlineClasses
    }}
  />

Это объект стиля:

const customInputStyle = {
  underline: {
    "&:hover:not($disabled):before,&:before": {
      borderColor: "#D2D2D2 !important",
      borderWidth: "1px !important"
    },
    "&:after": {
      borderColor: primaryColor
    }
  },
  underlineError: {
    "&:after": {
      borderColor: dangerColor
    }
  },
  underlineSuccess: {
    "&:after": {
      borderColor: successColor
    }
  },
  underlineCustom: {
    "&:after": {
      borderColor: props => props.customColor
    }
  }
}

вот как я экспортирую компонент:

export default injectSheet(customInputStyle, { link: true })(CustomInput);

person Derk Kleimeer    schedule 15.11.2018    source источник


Ответы (2)


Значения функций во вложенных правилах пока не поддерживаются, следите за обновлениями выпуска v10 в этом выпуске https://github.com/cssinjs/jss/issues/795

person Oleg Isonen    schedule 15.11.2018
comment
Я немного сбит с толку, потому что значения функций внутри медиа-запросов работают на меня, хотя я получаю предупреждение. Я использую response-jss 8.6.1 - person Andy; 02.03.2019
comment
Я использую версию 10.0 JSS, но все еще выдает предупреждения. Хотя он отображает стиль, но выдает предупреждения. Кто-нибудь обошел эти предупреждения на v10.0? - person Ehtesham Z; 04.12.2019

Вы должны использовать ::after вместо :after, посмотрите https://github.com/cssinjs/jss/issues/710 и https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements

person Fraction    schedule 18.03.2019