En mi aplicación, estoy construyendo una cadena:

tempString  = "n{amp}lt;b{amp}gt;"   dResult[y].dp5   "{amp}lt;/b{amp}gt;"; 

Puedo convertir mi n a {amp}lt;p{amp}gt; usando la división a continuación, pero ¿cómo puedo formatear mi texto con estilos, como el {amp}lt;b{amp}gt; :

  let newText = randString.split('n').map((item, i) ={amp}gt; { return {amp}lt;p key={i}{amp}gt;{item}{amp}lt;/p{amp}gt;; }); 

En mi pantalla, mi salida es: {amp}lt;b{amp}gt;Text{amp}lt;/b{amp}gt; , en lugar de en negrita el texto.

Para renderizar a HTML, quédese con JSX y pase componentes renderizados en lugar de cadenas. Puede pasar una matriz como elemento secundario a un componente Reaccionar, así que mantenga una matriz de componentes en lugar de una cadena:

 const tempComp = []; tempComp.push({amp}lt;b{amp}gt;{dResult[y].dp5}{amp}lt;/b{amp}gt;); 

y luego renderizarlo es un niño:

 {amp}lt;{amp}gt; {tempComp} {amp}lt;/{amp}gt; 
 // Example class component function BoldedComponent() { const strings = ['hello', 'world', 'john doe was here']; const tempComp = strings.map(item ={amp}gt; ({amp}lt;b{amp}gt;{item}{amp}lt;/b{amp}gt;)); const noBoldComp = strings.map(item ={amp}gt; ({amp}lt;p{amp}gt;{item}{amp}lt;/p{amp}gt;)); return ( {amp}lt;div{amp}gt; {tempComp} {noBoldComp} {amp}lt;/div{amp}gt; ); } // Render it ReactDOM.render( {amp}lt;BoldedComponent /{amp}gt;, document.getElementById("react") ); 
 {amp}lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"{amp}gt;{amp}lt;/script{amp}gt; {amp}lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"{amp}gt;{amp}lt;/script{amp}gt; {amp}lt;div id="react"{amp}gt;{amp}lt;/div{amp}gt; 

¿Por qué no construir tempString como una matriz de cadenas para que no tenga que usar el método split() y aún así pueda lograr esto?

 const tempString = []; ... tempString.push(dResult[y].dp5); ... ... let newText = tempString.map((item, i) ={amp}gt; { return {amp}lt;b key={i}{amp}gt;{item}{amp}lt;/b{amp}gt;; }); 

O incluso mejor construyendo su tempString como una matriz de componentes de reacción:

 const tempComp= []; ... tempComp.push({amp}lt;b key={i}{amp}gt;{dResult[y].dp5}{amp}lt;/b{amp}gt;); ... ... {amp}lt;{amp}gt; {tempComp} {amp}lt;{amp}gt;