如何在 React-Native 中将某些文本设置为粗体？

Question

我知道如何将一些文本设置为粗体，如下所示。

<Text>I am<Text style={{fontWeight:bold}}>a developer</Text></Text>

但是我需要道具的使用方法

例如，

  <FlatList
          data={[{
            title: 'I am<Text style={styles.bold}>a developer</Text>',
            key: 'item1',
            id: 1
          }]}
          extraData={this.state}
          renderItem={this._renderItem}
        />

_renderItem 中使用了 FlatList 中的标题。

<Text>this.props.title</Text>

但是在设备的屏幕上显示如下。

I am<Text style={styles.bold}>a developer</Text>

道具中的标题仅呈现字符串。

Answer 1

我想你应该将 jsx 传递给 title prop :

title: {<Text>I am <Text style={{fontWeight:bold}}>a developer</Text></Text>}

编辑：如果这不起作用，您可以将您的标题分成 2 个道具：

<FlatList
    data={[{
      title: 'I am',
      titleBold: 'a developer'
      key: 'item1',
      id: 1
    }]}
    extraData={this.state}
    renderItem={this._renderItem}
 />

然后在_renderItem中这样显示：

<Text>{this.props.title}<Text style={styles.bold}>{this.props.titleBold}</Text></Text>

如何在 React-Native 中将某些文本设置为粗体？

How do I set some text to bold in React-Native?

text

render

react-native

react-props