¿Hay alguna manera de obtener enlaces de reacción del archivo JSON? por ejemplo de:
const data = [ { id: 1, paragraph: `Some text <Link to="/main-page">main page</Link> some text.` }, { id: 2, paragraph: `Some text <Link to="/main-page">main page</Link> some text.` }, ]; const App = () => ( {data.map((item) => ( <div key={item.id}> <p dangerouslySetInnerHTML={{ __html: item.paragraph }}> </p> </div> ))} ); ReactDOM.render( <App />, document.getElementById('root') );peligrosamenteSetInnerHTML funciona solo para etiquetas HTML y no ayuda en este caso
No entiendo completamente lo que está tratando de lograr, pero puede importar
el archivo json cambia los datos a un objeto y úsalo
pero primero necesita instalar json-loader y cargar los datos en cualquier lugar que desee
export default { "data" : "data" } import someData from './someData' const arr = [someDta.json()]; return (<div> {arr.map(item => { {paragraph: `Some text <Link to="/main-page">{{item .data}}</Link> some text.`} })} </div> )Si no hay otra forma y estos son los datos que debe procesar, puede usar una expresión regular para extraer esta información del texto y luego volver a crear el Link .
let paragraph = 'Some text <Link to="/main-page">main page</Link> some text.' console.log('Link text ==>', paragraph.match(/(?<=>)[^<]+/)[0]) console.log('Link target ==>', paragraph.match(/(\S+)=["']?((?:.(?!["']?\s+(?:\S+)=|[>"']))+.)["']?/)[2])aunque, la mejor solución es la que señaló Lissy93.