Обновление компонента React Native force, когда приложение переходит на передний план
Мое приложение отображает некоторые тексты. Мне нужно повторно визуализировать Component, когда размер шрифта изменяется через Настройки --> Специальные возможности --> Размер шрифта:
Итак, в основном это последовательность se:
- Приложение открыто (передний план).
- Пользователь открывает настройки телефона, поэтому приложение переходит на передний план (не полностью закрывается).
- Пользователь изменяет размер шрифта через Настройки --> Специальные возможности --> Размер шрифта.
- Пользователь закрывает настройки и открывает приложение, которое переходит на передний план. опять таки.
На данный момент мне нужно перезагрузить приложение, потому что некоторые Components нужно адаптировать.
Я использую реагировать на родной информации об устройстве, чтобы получить размер шрифта с помощью const fontScale = DeviceInfo.getFontScale();, но его значение не обновляется до тех пор, пока приложение не будет полностью закрыто и открыто.
Есть идеи?
Ответы 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.info('App has come to the foreground!');
}
this.setState({appState: nextAppState});
};
render() {
return <Text>Current state is: {this.state.appState}</Text>;
}
}
Я не углублялся в хуки, но мне потребовалось всего несколько минут, чтобы преобразовать такой простой компонент в функциональный компонент с помощью hooks. То, что я сейчас использую, это recomposeJS
Я всегда получаю сообщение об ошибке «Не могу выполнить обновление состояния React для несмонтированного компонента» всякий раз, когда я использую setState в обработчике событий appStateChange. Есть идеи, почему?
Спасибо за Ваш ответ! Можно ли реализовать с помощью хуков? Я новичок в React, и в моем проекте используются хуки.