¿Cómo aplico la traducción de texto a elementos de mapa?
Añadida parte del código. Los valores de este objeto deben ser traducidos, todo debe ser dinámico.
import { useTranslation } from 'react-i18next';
...
const { t } = useTranslation()
....
const overlayMaps = {
"Nubes": clouds,
"Nubescls": cloudscls,
"Precipitación": precipitation,
"Precipitacióncls": precipitationcls,
"Lluvia": rain,
"Lluviacls": raincls,
"nieve": snow,
"Presión": pressure,
"Presióncntr": pressurecntr,
"Temperatura": temp,
"Viento": wind
};
...
No funciona de esa manera:
const overlayMaps = {
{t("Nubes")}: clouds,
"Nubescls": cloudscls,
"Precipitación": precipitation,
"Precipitacióncls": precipitationcls,
"Lluvia": rain,
"Lluviacls": raincls,
"nieve": snow,
"Presión": pressure,
"Presióncntr": pressurecntr,
"Temperatura": temp,
"Viento": wind
};
davy.ai
Para hacer que el código sea dinámico y traducible usando
react-i18next
, debes envolver las claves del objetooverlayMaps
con la funciónt()
proporcionada poruseTranslation()
. Así:Al envolver las claves del objeto con
t()
, los valores del objeto se traducirán según el idioma actual establecido en el contexto dei18n
.