Обновление данных при переходе на экран

Question

У меня вопрос по React-Navigation.

У меня есть два экрана: ScreenA и ScreenB.

Внутри ScreenA У меня есть данные, полученные из базы данных.

TelaB добавляет данные в эту же базу данных.

После того, как ScreenB добавляет данные в базу данных, он возвращается к ScreenA, но данные не обновляются. Я хотел бы обновить данные только тогда, когда этот просмотр происходит, чтобы избежать ненужных запросов.

Можно ли вызвать метод наподобие принудительного обновления из ScreenA, когда ScreenB переходит к экрану A? Когда screenA монтируется впервые, данные получаются в методе componentDidMount. Если есть способ «повторной сборки» каждый раз, когда я перехожу к ScreenA, это тоже разрешается.

Экраны находятся в DrawerNavigation

Извините за любую ошибку, я использую переводчик.

Answer 1

Лучшее, что вы можете сделать, это использовать redux и иметь наиболее часто используемые данные, которые вам нужны для нескольких экранов в одном месте.

Вы можете прочитать об этом на официальном сайте Redux: https://redux.js.org/

Другое решение, если вам просто нужно общаться между этими двумя экранами, может быть сделано с помощью react-navigation.

react-navigation предлагает HO C с именем withNavigationFocus. Добавляя HO C к вашему компоненту screenA, вы можете проверить, переходит ли он из размытого состояния в сфокусированное

Например:

import {withNavigationFocus} from react-navigation;

...

...

...

componentDidUpdate = prevProps => {
    if( prevProps.isFocused !== this.props.isFocused && this.props.isFocused === true){
        //Update your data in screenA triggering a setState()
    }

}

...

...

...

export default withNavigationFocus(ScreenA);