We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
当我给styled.div等声明方式生成的组件,赋予class属性时,由插件自动生成的styled-xxxx类名被覆盖了而不是合并,导致样式失效
No response
const GameHeaderLayout = styled.div` display: flex; align-items: center; gap: 0 4px; padding: 12px 0; position: relative; &.is-line { &::after { position: absolute; content: ''; left: 0; bottom: 0; width: 100%; height: 1px; background-color: ${props => props.theme.border100}; transform: scaleY(0.5); } } .title { color: ${props => props.theme.primary}; font-family: 'PingFang SC'; font-size: 14px; font-style: normal; font-weight: 500; line-height: 16px; /* 114.286% */ } ` type StatisticsHeaderProps = { title: string icon: VNode isLine?: boolean } export const GameHeader: FunctionalComponent<StatisticsHeaderProps> = props => { const { isLine = true } = props return ( <GameHeaderLayout className={classNames('game-header', { 'is-line': isLine, })} > {props.icon} <div className="title">{props.title}</div> </GameHeaderLayout> ) }
以上的代码,如果给GameHeaderLayout复制一个class或者className, 会导致样式丢失, 经过排查,发现如下截图描述的问题:
期望当我赋值类名给styled的组件时,类名是应该是合并而不是覆盖重置
The text was updated successfully, but these errors were encountered:
className是会把原有的类名都覆盖掉,试下用class吧,class是没问题的
Sorry, something went wrong.
好的,谢谢
No branches or pull requests
bug描述
当我给styled.div等声明方式生成的组件,赋予class属性时,由插件自动生成的styled-xxxx类名被覆盖了而不是合并,导致样式失效
Reproduce link
No response
To reproduce
以上的代码,如果给GameHeaderLayout复制一个class或者className, 会导致样式丢失, 经过排查,发现如下截图描述的问题:
Expected behavior
期望当我赋值类名给styled的组件时,类名是应该是合并而不是覆盖重置
Actual behavior
No response
Package version
No response
Framework version
No response
Node version
No response
Browsers version
No response
OS version
No response
Additional context
No response
The text was updated successfully, but these errors were encountered: