You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

React Native如何检测iOS设备是否设置为RTL布局语言

React Native iOS端检测RTL书写规则状态的实现方案

推荐方案:使用官方内置I18nManager模块

这是最稳定的实现方式,不需要手动解析语言标识,直接调用官方封装好的属性即可,同时兼容iOS和Android双端:
首先导入模块:
import { I18nManager } from 'react-native';
直接读取RTL状态:
const deviceIsRTL = I18nManager.isRTL;
返回值为布尔值,系统设置为RTL语言时返回true,LTR语言时返回false。

方案二:基于你当前的语言获取逻辑手动判断

如果你需要基于已有的NativeModules.SettingsManager取语言的逻辑自行判断,可以通过匹配RTL语言前缀的方式实现:

实现代码:

import { NativeModules } from 'react-native';

// 定义所有RTL语言的前缀集合
const RTL_LANG_PREFIXES = [
  'ar', // 阿拉伯语
  'fa', // 波斯语
  'he', // 希伯来语
  'ur', // 乌尔都语
  'ug', // 维吾尔语
  'ps', // 普什图语
  'sd', // 信德语
  'ku', // 库尔德语
  'yi', // 意第绪语
  'dv'  // 迪维希语
];

const checkIsRTL = () => {
  // 获取当前系统优先语言
  const currentLanguage = NativeModules.SettingsManager?.settings?.AppleLanguages?.[0] || '';
  // 提取语言主标识,兼容ar-EG、zh-Hans这类带区域/后缀的格式
  const langMainCode = currentLanguage.split('-')[0].toLowerCase();
  return RTL_LANG_PREFIXES.includes(langMainCode);
};

const isRTL = checkIsRTL();

注意:NativeModules.SettingsManager属于iOS端非公开原生模块,官方没有做版本兼容承诺,不同React Native版本可能出现结构变动导致取值失败,生产环境优先选择I18nManager方案。

内容的提问来源于stack exchange,提问作者Zephyr

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.28 03:54:07