在 React Native 中使用 Styled Components 为子项设置样式

Question

我在不同的文件（Container.tsx、Border.tsx）中有两个独立的组件，我将它们呈现如下：

<Border>
    <Container>{children}</Container>
</Border>

我想要的是使用父级（Border.tsx）中的样式给容器一个边框，所以它看起来像这样：

const Border = styled(View)<BorderProps>`
    child selector { border style } 
`

我想这样做是为了让它们尽可能灵活。 这可行吗？ 谢谢。

Answer 1

在我看来，这里值得设置边框样式和其他选项，而不是在单独的组件中，而是在容器本身中，例如：

const Container = styled.View`
flex: 1;
border-style: solid;
border-width: 1px;
`;