当应用程序进入前台时，React Native 强制组件刷新

Question

我的应用程序显示一些文本。当字体大小通过设置更改时，我需要重新呈现 Component --> 辅助功能 --> 字体大小：

所以基本上这是 se 序列：

• 应用程序已打开（前台）。
• 用户打开 Phone 设置，因此应用进入前台（未完全关闭）。
• 用户通过设置 --> 辅助功能 --> 更改字体大小 字体大小。
• 用户关闭设置并打开应用进入前台 再次.

此时我需要重新加载应用程序，因为一些 Components 需要适配。

我正在使用 react-native-device-info 通过 const fontScale = DeviceInfo.getFontScale(); 获取字体大小，但它的值在应用程序完全关闭和打开之前不会更新。

有什么想法吗？

Answer 1

您可以将 appstate 设置为 nextAppState。它应该会导致组件重新呈现。

import React, {Component} from 'react';
import {AppState, Text} from 'react-native';

class AppStateExample extends Component {
  state = {
    appState: AppState.currentState,
  };

  componentDidMount() {
    AppState.addEventListener('change', this._handleAppStateChange);
  }

  componentWillUnmount() {
    AppState.removeEventListener('change', this._handleAppStateChange);
  }

  _handleAppStateChange = (nextAppState) => {
    if (
      this.state.appState.match(/inactive|background/) &&
      nextAppState === 'active'
    ) {
      console.log('App has come to the foreground!');
    }
    this.setState({appState: nextAppState});
  };

  render() {
    return <Text>Current state is: {this.state.appState}</Text>;
  }
}