问题描述
我正在尝试扩展我的主题(修改默认组件)并将我的新默认道具传递给 Input 组件。我需要 focusBorderColor 来改变当前的颜色模式。我试图将一个函数传递给 defaultProps 参数,但这破坏了我的 Input 组件上的所有样式:
const theme = extendTheme({
components: {
Input: {
defaultProps: props => ({
variant: 'filled',focusBorderColor: props.colorMode === 'light' ? 'gray.200' : 'gray.600',}),},})
我还尝试通过 baseStyle 属性设置我的组件的样式并且这有效,但是所有默认的基本样式都通过向其传递函数而被覆盖。我需要向 baseStyle 添加属性并保留默认的 baseStyles(仅扩展但使用颜色模式)。
const theme = extendTheme({
components: {
Input: {
baseStyle: props => ({
field: {
width: props.colorMode === 'dark' ? '50%' : '80%',})
有什么方法可以将 colorMode 传递给默认道具?或者有什么方法可以在不丢失默认baseStyles的情况下使用函数声明正确扩展baseStyle? 感谢您的帮助!
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)