Saltar al contenido

react-i18next: interpolación de enlace en etiqueta HTML en medio del texto

Posterior a investigar en diversos repositorios y sitios webs de internet al terminar nos hemos encontrado la resolución que te compartimos más adelante.

Solución:

Con react-i18next v4.4.0 presentamos un nuevo componente Trans:

See the description below.

El json sería: See the <1>description below.

o aún más complejo:


Hello name, you have count unread message. Go to messages.

La nueva característica está documentada aquí: https://react.i18next.com/latest/trans-component

Este es el problema común de react-intl y react-i18next – ambas bibliotecas tienen un soporte muy limitado de componentes en línea y formato de texto enriquecido dentro de las traducciones (ya lo describí aquí con más detalles).

Si todavía está al comienzo de su proyecto, es posible que desee considerar una biblioteca i18n diferente: js-lingui (descargo de responsabilidad: soy el autor). Es la primera (y hasta ahora la única) biblioteca con soporte completo para componentes en línea.

Simplemente escribes:

See the description below.

y sus traductores trabajarán con el mensaje See the <0>description below.

El único precio es que necesita usar un complemento babel adicional, lo que lo hace posible.

Si te animas, puedes dejar un escrito acerca de qué te ha parecido este post.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *