Как выделить текст построчно в React Native

Question

Я хочу сделать выделение текста в моем приложении React Native.Я использую текстовый компонент React Native для отображения текста, и я могу дать ему backgroundColor, но то, что я действительно выделяю, как у вас, это на следующем изображении:

Answer 1

Для этого вы можете использовать библиотеку Reaction-native-Highlight-Words .

Вот пример:

import React, { Component } from 'react';
import { Text, View } from 'react-native';
import Highlighter from 'react-native-highlight-words';

export default class Example extends Component {
  render() {
    return (
      <View style={{alignItems: 'center', paddingTop: 300}}>
        <Highlighter
          highlightStyle={{backgroundColor: 'greenyellow'}}
          searchWords={["Swine Flu is an infection caused by"]}
          textToHighlight="Swine Flu is an infection caused by..."
        />
        <Highlighter
          highlightStyle={{backgroundColor: 'lightblue'}}
          searchWords={["swine flu"]}
          textToHighlight="The risk of swine flu..."
        />
      </View>
    );
  }
}