没有 forceRTL 的 React Native Arabic (RTL)

Question

在 RN 我的双语应用程序（英语-阿拉伯语）中，我使用了 I18nManager（浏览量）和 I18n（翻译）

当我将应用程序语言更改为阿拉伯语时，整个应用程序会使用以下代码从初始屏幕重新加载：

I18nManager.forceRTL(true)

理想情况下，它不应从一开始就重新启动应用程序，而应继续显示阿拉伯语数据的当前屏幕。

目前，它没有发生，只有翻译元素正在使用 I18n.t('keyword') 进行转换，但对于视图阿拉伯语对齐，这是不正确的。

仍在寻找更好的解决方案，如果有人实现了请告诉我。

谢谢
索普!!

Answer 1

您应该将此代码放在项目的顶部组件中

import RNRestart from "react-native-restart";

I18nManager.forceRTL(true); if (!I18nManager.isRTL) RNRestart.Restart();

Answer 2

我正在做一个有两种语言的项目，阿拉伯语和 English.i 使用 redux 来处理应用程序语言。我将所有样式放在 redux 上，并使用 redux 处理应用程序样式。当用户更改语言时，我应用程序上的所有样式都会更改为该语言。所有文本也用 redux 处理。通过这种方式，我的应用程序不会重新加载并且应用程序语言会立即更改。

Answer 3

世博会使用

import {Updates} from "expo"

Updates.reload()

Answer 4

如果你们想在重新加载后存储堆栈状态（因为没有其他选项不重新加载）并且想要返回堆栈状态你也可以按照这个link你可以检查我的代码。 Link: React navigation state persist

任何组件

AsyncStorage.setItem('navigation_state', JSON.stringify(navigation.dangerouslyGetState()));

我的App.js

const App = () => {
  const [initialState, setInitialState] = useState();
  const [isReady, setIsReady] = useState(false);

  useEffect(() => {
    restoreState();
  }, []);
  const restoreState = async () => {
    try {
      const savedStateString = await AsyncStorage.getItem('navigation_state');
      const state = savedStateString ? JSON.parse(savedStateString) : undefined;
      if (state !== undefined) {
        AsyncStorage.removeItem('navigation_state');
        setInitialState(state);
      }
    } finally {
      setIsReady(true);
    }
  };
  if (!isReady) {
    return null;
  }
  return (
    <Provider store={store}>
      <NavigationContainer
        initialState={initialState}
        ref={rootNavigationRef}>
        <Root>
          <AppNavigator />
        </Root>
      </NavigationContainer>
    </Provider>
  );
};

Answer 5

如果您的应用是 android 混合应用，您可以试试这个：

import com.facebook.react.modules.i18nmanager.I18nUtil;

I18nUtil i18nUtil = I18nUtil.getInstance();
i18nUtil.forceRTL(context, forceRtl);
i18nUtil.allowRTL(context, true);

值 'forceRtl' 是一个布尔值。

对于iOS，我想你也能找到同样的方法。

没有 forceRTL 的 React Native Arabic (RTL)

React Native Arabic (RTL) without forceRTL

react-native

react-native-android

react-native-ios