时间戳

首页 > 解决方案 > React Native / Styled Components - 覆盖样式化组件样式

react-native - React Native / Styled Components - 覆盖样式化组件样式

问题描述

我正在使用 Styled-Components 来设置我的 React Native 组件的样式，但是，当我为 React.js 组件设置样式时，我习惯使用的一些基本功能无法按预期工作。

我希望有人有解决方案，因为我正在努力从谷歌那里找到答案。

我无法重新设置现有样式组件的样式。以下在 reactjs 中工作正常。

const StyledText = styled.Text`
  color: blue;
`

const GreenText = styled(StyledText)`
  color: green;
`

// This also doesn't work:
// const GreenText = styled(StyledText)`
//   && {
//    color: green;
//   }
// `

const TextExample = () => (
 <View>
  <StyledText>This text is blue</StyledText>
  <GreenText>This text is also blue, but should be green?</GreenText>
 </View>
)

注意：这不仅仅是忽略颜色覆盖，如果我添加任何其他样式规则，它们也会被忽略GreenText

标签： react-nativestyled-components

解决方案

推荐阅读