What's the best way to get device locale in react native (iOS)?

Something similar to [NSLocale currentLocale] in Objective-C.

There's no need for an external library. You can find what you're looking for in React's Native Modules

import { NativeModules } from 'react-native'

// iOS:
const locale = NativeModules.SettingsManager.settings.AppleLocale ||
               NativeModules.SettingsManager.settings.AppleLanguages[0] // "fr_FR"

// Android:
const locale = NativeModules.I18nManager.localeIdentifier // "fr_FR"

To test this, I changed the language on my device to French. Here's a sample of what you'll find in the NativeModules.SettingsManager.settings object related to locale:

{
    ...
    AppleKeyboards: [
        "fr_FR@hw=US;sw=QWERTY",
        "en_US@sw=QWERTY;hw=Automatic",
        "es_419@sw=QWERTY-Spanish;hw=Automatic",
        "emoji@sw=Emoji"
    ]
    AppleLanguages: ["fr-US", "en-US", "es-US", "en"]
    AppleLanguagesDidMigrate: "9.2"
    AppleLocale: "fr_FR"
    NSLanguages: ["fr-US", "en-US", "es-US", "en"]
    ...
}

import { Platform, NativeModules } from 'react-native'

const deviceLanguage =
      Platform.OS === 'ios'
        ? NativeModules.SettingsManager.settings.AppleLocale ||
          NativeModules.SettingsManager.settings.AppleLanguages[0] //iOS 13
        : NativeModules.I18nManager.localeIdentifier;

console.log(deviceLanguage); //en_US

I am using the i18n package (react-native-i18n). And then it's just:

I18n = require('react-native-i18n')
locale = I18n.currentLocale()

Nothing of the above worked for me, but this component.

console.log("Device Locale", DeviceInfo.getDeviceLocale()); // e.g en-US

function getLocale() {
  if (React.Platform.OS === 'android') {
    return I18n.locale;
  } else {
    return NativeModules.SettingsManager.settings.AppleLocale.replace(/_/, '-');
  }
}

iOS 13 workaround here:

locale = NativeModules.SettingsManager.settings.AppleLocale // "fr_FR"
console.log(" ==> Current settings: ", NativeModules.SettingsManager.settings)
if (locale === undefined) {
    // iOS 13 workaround, take first of AppleLanguages array 
    locale = NativeModules.SettingsManager.settings.AppleLanguages[0]
    if (locale == undefined) {
          return "en" // default language
    }
}

You can install react-native-i18n and use this function:

import React, { NativeModules } from 'react-native'
...
function getLocale () {
  if (React.Platform.OS === 'android') {
    return NativeModules.RNI18n.getCurrentLocale(locale => locale.replace(/_/, '-'))
  } else {
    return NativeModules.RNI18n.locale.replace(/_/, '-')
  }
}

Works both under Android and iOS.

This code is future proof

import {NativeModules} from 'react-native';

function getSystemLocale(): string {
  let locale: string;
  // iOS
  if (
    NativeModules.SettingsManager &&
    NativeModules.SettingsManager.settings &&
    NativeModules.SettingsManager.settings.AppleLanguages
  ) {
    locale = NativeModules.SettingsManager.settings.AppleLanguages[0];
    // Android
  } else if (NativeModules.I18nManager) {
    locale = NativeModules.I18nManager.localeIdentifier;
  }

  if (typeof locale === 'undefined') {
    console.log('Couldnt get locale');
    return 'en';
  }

  return locale;
}

export default {
  getSystemLocale,
};

You may need to extend react native yourself to get this info. But, depending on your use case, this localization component (stefalda/ReactNativeLocalization) may work for you.

I found this solution for Android and iOS (RN 0.35)

import React, {NativeModules} from 'react-native';

if (NativeModules.I18nManager) {
	const {localeIdentifier, isRTL} = NativeModules.I18nManager;
}

May be this will help to someone, but iOS not shows locale property. It shows only rtl support now.

if you develop over Expo... you can use:

console.log(await NativeModules.ExponentUtil.getCurrentLocaleAsync());
console.log(await NativeModules.ExponentUtil.getCurrentDeviceCountryAsync());
console.log(await NativeModules.ExponentUtil.getCurrentTimeZoneAsync());

NativeModules solution can be changed over time by Facebook developers.
Because of this reason I had prepared a component. (It works only on Android for now)

Sample usage:

import SystemSettings from 'react-native-system-settings'

SystemSettings.get(
	settings => console.log('settings: ', settings)
)

Also promise-then can be used:

SystemSettings.get().then(settings => console.log('settings: ', settings)).done()

Also ES7 async-await method can be used!

class App extends React.Component {
	componentWillMount() {
		this._loadInitialState()
	}
	
	_loadInitialState = async () => {
		try {
			let settings = await SystemSettings.get()
			// Now settings variable would be filled and can be used!
		} catch (error) {}
	};
}

A sample result:

{
	densityDpi: 320,
	fontScale: 1,
	hardKeyboardHidden: "no",
	keyboard: "qwerty",
	keyboardHidden: "no",
	localization: {
		country: "US",
		displayCountry: "United States",
		displayLanguage: "English",
		displayName: "English (United States)",
		is24HourFormat: false,
		language: "en",
		locale: "en_US",
		networkCountry: "US",
		simCountry: "US",
		timeZone: {
			ID: "Europe/Amsterdam",
			displayName: {
				long: "Amsterdam Standard Time",
				short: "GMT+01:00",
			},
			offset: 3600000
		}
	},
	orientation: "portrait",
	screenHeightDp: 615,
	screenLayout: "normal",
	screenWidthDp: 360,
	smallestScreenWidthDp: 360,
	uiModeType: "normal"
}

Personally I prefer use react-native-i18n. then you can use like this inside the documentation..

import { getLanguages } from 'react-native-i18n'

getLanguages().then(languages => {
  console.log(languages) // ['en-US', 'en']
})

link: https://github.com/AlexanderZaytsev/react-native-i18n

$ npm install --save react-native-localize

--- or ---

$ yarn add react-native-localize

---

import * as RNLocalize from "react-native-localize";

console.log(RNLocalize.getLocales());

let defaultLanguage = RNLocalize.getLocales()[0].languageCode;

console.log('defaultLanguage', defaultLanguage);

I am using react-native-i18n

in order to access the device's language I used:

import { getLanguages } from 'react-native-i18n';

getLanguages().then(languages => {
  console.log(languages); // ['en-US', 'en']
});

It's all in the documentation.