Как получить текущую локаль с помощью i18next / response-i18next?

Я новичок в системе реагирования, и я пытаюсь получить текущую локаль с устройства пользователя. На данный момент у меня есть 2 версии моего приложения: французская и английская. Он отлично работает, когда я меняю резервный язык, у меня есть две версии приложения. Но мне не удается изменить язык прямо с устройства.

Мы можем изменить вручную, но если мы установили французский язык на устройстве, мы не сможем получить французский язык напрямую.

введите описание изображения здесь

import i18next from 'i18next';
import {initReactI18next} from 'react-i18next';

const languageDetector = {
  type: 'languageDetector',
  async: true,
  detect: cb => cb('en'),
  init: () => {},
  cacheUserLanguage: () => {},
};

i18next
  .use(languageDetector)
  .use(initReactI18next)
  .init({
    fallbackLng: 'en',
    debug: true,
    resources: {
      en: {
        translation: {
          hello: 'Hello world',
          change: 'Change language',
        },
      },
      sv: {
        translation: {
          hello: 'Hallo!',
          change: 'Goedemorgen',
        },
      },
    },
  });

export default i18next;

App.js

import React from 'react';
import { Text, View, TouchableOpacity } from 'react-native';
import { useTranslation } from 'react-i18next';
import './src/Traslations'


export default function App() {
  const { t, i18n } = useTranslation();
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text style={{ fontSize: 20, marginBottom: 20 }}>{t('hello')}</Text>
      <Text style={{ fontSize: 20, marginBottom: 20 }}>{t('change')}</Text>

      <TouchableOpacity style={{backgroundColor: 'pink'}} onPress={() => i18n.changeLanguage(i18n.language === 'nl' ? 'en' : 'nl')}>
        <Text>{t('change')}</Text>
      </TouchableOpacity>
    </View>
  );
  }

person Vishal    schedule 31.05.2021    source источник
comment
Вы хотите, чтобы ваше приложение обнаруживало изменения в device-lang ... и автоматически обновляло app-lang ... это вы имеете в виду?   -  person Hend El-Sahli    schedule 31.05.2021
comment
Не могли бы вы просмотреть приведенное выше изображение в формате GIF? Надеюсь, вы поймете это.   -  person Vishal    schedule 31.05.2021
comment
Не могли бы вы включить код в свой I18n/index.js   -  person Hend El-Sahli    schedule 31.05.2021
comment
Я не понял вашей точки зрения, я уже включил код для обоих языков   -  person Vishal    schedule 31.05.2021
comment
Ваш i18n код, в котором вы обнаруживаете изменения языка и устанавливаете свой fallback lang ...   -  person Hend El-Sahli    schedule 31.05.2021
comment
Проверьте код выше.   -  person Vishal    schedule 31.05.2021


Ответы (2)


Ваш languageDetector использует en как fallback язык ...

Убедитесь, что language-prefix, который вы выбираете на своем устройстве, - это sv ‹< - ключ, который вы используете в настройках i18n ...

const languageDetector = {
  type: 'languageDetector',
  async: true,
  detect: cb => cb('en'), // <<---- here
  init: () => {},
  cacheUserLanguage: () => {},
};

Вместо этого

Вы хотите передать current-device-lang

import { Platform, NativeModules, Dimensions } from 'react-native';
const getDeviceLang = () => {
  const appLanguage =
    Platform.OS === 'ios'
      ? NativeModules.SettingsManager.settings.AppleLocale ||
        NativeModules.SettingsManager.settings.AppleLanguages[0]
      : NativeModules.I18nManager.localeIdentifier;

  return appLanguage.search(/-|_/g) !== -1
    ? appLanguage.slice(0, 2)
    : appLanguage;
};

detect: async callback => {
  const deviceLang = getDeviceLang();
  callback(appLanguage);
},

Более подробную информацию можно найти на здесь с рабочим образцом ...

person Hend El-Sahli    schedule 31.05.2021
comment
Ваше решение лучше всего, но на самом деле я нахожу без выборки язык по умолчанию. Похоже, это тоже должно быть поддержано в библиотеке .. Во всяком случае. Спасибо за ответ. - person Vishal; 31.05.2021

i18next.language или i18next.languages ​​ может помочь.

person adrai    schedule 01.06.2021