问题描述
导入Chakra UI时出现此错误。
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");
解决方法
从文档中很难理解这一点,一种变色实际上是一组颜色。
在主题中,您需要定义颜色和相应的:hover值,例如所以:
selected
然后您在组件中引用它,如下所示:
yellow: {
500: "#FFFF80",//this is the default color
600: "#FFFF00" //this is the color on hover
},