En la aplicación Next Js, estoy usando el módulo next-i18next para compatibilidad con varios idiomas. Está funcionando bien.
Código del componente NabBar:
const NavBar = ({...props}) => { const router = useRouter() const { t } = useTranslation('navbar'); const onChangeLanguage = (lang) => (e)=> { e.preventDefault() if(lang === 'ar') { router.push('ar') } else { router.push('/') } } ..... <input type="radio" onClick={onChangeLanguage('en')} /> <label >English</label> <Input type="radio" onClick={onChangeLanguage('ar')} /> <label >Arabic</label> } export default NavBar; al hacer clic en árabe, se aplica /ar después del dominio. por ejemplo http://localhost:3000/ar
Pero ahora quiero mostrar el botón de opción seleccionado en todas las páginas. ¿Alguien puede sugerir cómo puedo mostrar el botón de opción marcado correspondiente al idioma seleccionado?
Puede obtener la configuración regional activa actual del enrutador. Está disponible en router.locale
Y luego simplemente verificaría si la identificación de la casilla de verificación coincide con la configuración regional activa