Compare text and highlight differences in react-native

Viewed 386

Today i want to create a app in react-native that compare two string for first time it will be simple . For example

var str1 = "Hello there";
var str2 = "Hello";

I want to highlight a word that is different from the other text. And in example it is there. Something like online compare tools. So it will looks like enter image description here

"There" word is with different background !

So i have no idea how to start. I tried with this code

const CustomText = (props) => {
    const text1 = props.str1.split(' ');
    const text2 = props.str2.split(' ');
    return <Text>{text1.map(text => {
      if (!text.includes(// here i should compare with other text)) {
        return <Text style={{ color: 'blue' }}>{text} </Text>;
      }
      return `${text} `;
    })}</Text>;
}

I dont knwo how to map this two string to compare each other . Thanks for helping ...

0 Answers
Related