如何仅在本机中为文本设置背景色

Question

在HTML中，我可以通过实现

<span style="background-color:red">ketan</span>

但是在本机中如何实现此功能，以便仅将颜色应用于文本。

Answer 1

如果希望背景色仅包含文本，则可以使用以下方法：

<Text style={{backgroundColor: 'blue', alignSelf: 'flex-start'}}>
    Ketan
</Text>

只需根据需要更改alignSelf即可，如果您不希望文本占据容器的整个宽度，则需要设置此属性

为我工作，您也可以添加一个父视图，您可以设置如下属性：alignSelf：'flex-start'，borderRadius：10，overflow：'hidden'，backgroundColor：'red'， (2认同)

Answer 2

在本机反应中，您有用于Text显示文本的组件。

要设置的颜色Text，您可以使用color它的属性

<Text style={{color:'#ff0000'}}>Your Text</Text>

对于该文本的背景颜色，您可以使用View和比backgroundColor设置View