#javascript #html #css #chakra
#javascript #HTML #css #chakra-ui
Вопрос:
Я получаю эту ошибку при импорте пользовательского интерфейса Chakra.
if (variantColorIsDefined) {
var variantColorExists = variantColor in theme.colors; // If variant color exists in theme object
^ 114 |
if (!variantColorExists) {
console.warn("You passed an invalid variantColor to the " label " Component. Variant color values must be a color key in the theme object that has '100' - '900' color values. Check http://chakra-ui.com/theme#colors to see possible values");
Ответ №1:
это немного сложно понять из документов, вариант цвета на самом деле представляет собой набор цветов.
в вашей теме вам нужно определить цвет и соответствующее значение :hover, например, так:
yellow: {
500: "#FFFF80", //this is the default color
600: "#FFFF00" //this is the color on hover
},
затем вы ссылаетесь на него в своем компоненте следующим образом:
<IconButton size="sm" icon="unicorn" isRound variantColor="yellow" />