Как выполнить действие, когда пользователь заходит на экран или уходит от него?

Question

Это контейнер моего приложения:

const AppNavigator = createBottomTabNavigator({
    createUser: CreateUser,
    showUsers: ShowUsers,
    editUser: EditUser
});

в createUser Я создаю новых пользователей и сохраняю их в своей базе данных, а в showUsers на componentDidMount жизненном цикле я получаю данные из своей базы данных и перечисляю их. но так как экраны не отключаются при удалении от них, жизненный цикл componentDidMount вызывается только в первый раз, поэтому каждый раз, когда я получаю предварительный просмотр данных, мне приходится перезагружать приложение, чтобы увидеть результат. как я могу решить это?

Answer 1

React navigation имеет API жизненного цикла, чтобы делать именно то, что вы описываете:

Для получения дополнительной информации проверьте документы: https://reactnavigation.org/docs/en/navigation-lifecycle.html

Часть этого API - с NavigationFocus HOC, и это обеспечивает реквизит isFocused, который указывает, виден ли экран.

Пример:

import { withNavigationFocus } from 'react-navigation';

class SomeScreen extends React.Component {

  componentDidUpdate(prevProps) {
    if (this.props.isFocused && !prevProps.isFocused) {
      // Screen has now come into focus
    }
  }

}

export default withNavigationFocus(SomeScreen)