我使用ChakraUI复选框，如下所示:
export function CheckItem({ color, checked, label, onChange }: CheckItemProps) {
return (
<Checkbox
iconColor="white"
borderColor={color}
isChecked={checked}
onChange={onChange}
size="lg"
>
<Text fontSize="12px">{label}</Text>
</Checkbox>
);
}
如何在选中时设置复选框的框 colored颜色 ？
-
使用
bg设置包括文本在内的整个容器的背景. -
使用
color设置文本的 colored颜色 . -
使用
colorScheme不起作用，因为我使用的是十六进制值，而不是主题中的 colored颜色 . -
在我选中该框之前，
borderColor在未选中状态下会像我预期的那样工作，然后它会回到默认的蓝色填充状态.
我试过所有其他包含单词color的props 名称，但都不起作用.
我希望最后的结果是这样的:
export function CheckItem({ color, checked, label, onChange }: CheckItemProps) {
return (
<Checkbox
_checked={{
// I don't know what prop to put here...
}}
iconColor="white"
borderColor={color}
isChecked={checked}
onChange={onChange}
size="lg"
>
<Text fontSize="12px">{label}</Text>
</Checkbox>
);
}