React Native-以粗体显示第一行文本

Question

在我的应用中，我有笔记，我想以粗体显示文本的第一行，如下图所示

上面的屏幕截图来自Mi Notes应用程序。

Answer 1

我建议您将注释字符串一分为二，然后很容易分开，这是一个非常简单的示例：

import React, { Component } from 'react';
import { Text, StyleSheet } from 'react-native';

export default class TextComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      titleText: "Hi there,",
      bodyText: 'Redmi 3S/Prime will receive the MIUI 9 stable UPdate in mid-late December. Stay...'
    };
  }

  render() {
    return (
      <Text style={styles.baseText}>
        <Text style={styles.titleText}>
          {this.state.titleText}{'\n'}
        </Text>
        <Text numberOfLines={5}>
          {this.state.bodyText}
        </Text>
      </Text>
    );
  }
}

const styles = StyleSheet.create({
  baseText: {
    fontFamily: 'Cochin',
  },
  titleText: {
    fontWeight: 'bold',
  },
});