reactjs - How can I turn a string with style information into Text Components? -

for example, have string:

"wherefor art <strong>thou</strong> mr. <strong>fancypants</strong>" 

i need turn react-native text components , render() method. string transformed into:

<text>where art <text style={{ fontweight : 600}}>thou</text> mr. <text style={{fontweight: 600}}>fancypants</text>; 

so render method looks this:

render() {   let text = "wherefor art <strong>thou</strong> mr. <strong>fancypants</strong>";   return (     <view style={{marginbottom : 20}}>       <text>{this.filterhtml(text)}</text>     </view>   ) } 

and tried turning text components, doesn't work:

filterhtml = (text) => {   if (text) {     return text.replace(/<strong>([^<]*)<\/strong>/g, "<text style={{fontweight : 600}}>$1</text>")   }   return text; } 

not surprisingly ends happening literal string being rendered inside <text> element shown in render method:

"where art <text style={{ fontweight : 600}}>thou</text> mr. <text style={{fontweight: 600}}>fancypants". 

any ideas?

you asked how split multiple text components sounds end goal display html appropriately. if case check out react-native-htmlview. if not intent can @ least see how tackled problem.