React 原生样式：如何设置"sub element"样式？

Question

在 web css 中，我们可以为sub元素设置 css。例：

<div class="test">
<p>abc</p>
</div>

我们可以通过以下方式设置 css<p>：

.test p {
font-size:20px;
}

现在在 React Native 中，我有这个：

<View style={myStyle.test}>
<Text>abc</Text>
</View>

我们如何通过myStyle.test设置<Text>样式？

Answer 1

实际上你不能像 css 孩子那样使用，你必须为要使用的每个元素设置一个自定义样式。

Answer 2

react native 中的 CSS 只是 web css 的一个子集，它不允许你在 webCss 中做的事情。你所拥有的只是内联css。因此，您必须单独设置它们的样式。您可以通过定义通用样式对象来避免重复，并传递该对象而不是重复。

您也可以查看此库：

https://github.com/vitalets/react-native-extended-stylesheet

Answer 3

根据文档

所有核心组件都接受名为 style 的道具。样式名称和值通常与 CSS 在 Web 上的工作方式相匹配，除了名称是使用驼峰大小写编写的，例如 backgroundColor 而不是 background-color

现在在 react-native 中不支持级联，yo =你必须为每个元素提供一个样式道具才能对其进行样式设置。