Я пытаюсь изменить цвет подчеркивания границы компонента ввода Material-UI.Но следующий код не работает и выдает следующую ошибку:
Предупреждение: правило не связано.Параметр недостающего листа "link: true"
Это мои импортные данные:
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);