Возможно ли получить доступ к хранилищу приставок, когда пользователь не находится в текущем компоненте?

Question

Представьте, что у меня есть два компонента: LoginComponent и MainScreenComponent.

. Я создал EventListener на LoginComponent, который будет получать push-уведомления в любое время.После входа в систему мы переместим пользователя на MainScreenComponent, поэтому LoginComponent больше не активен.

class LoginComponent extends Component {
  constructor(props, context) {
  super(props);

  OneSignal.init('xx');
  OneSignal.addEventListener('opened', this.onOpened);
  this.context = context;
 }
}

componentWillUnmount() {
  OneSignal.removeEventListener('received', this.onReceived);
  OneSignal.removeEventListener('registered', this.onRegistered);
  OneSignal.removeEventListener('ids', this.onIds);
  OneSignal.removeEventListener('opened', this.onOpened);
}

onOpened(openResult) {

  const { dispatch } = this.context.store; //Cannot read property store from undefined?
  const boundActions = bindActionCreators(actions, dispatch);
  // this.props.storeNotification({ notification: openResult.notification });
}

Поскольку мой слушатель событий остается в LoginComponent, мне нужно было бы получить доступ к действию, чтобысохранить уведомление, полученное для хранения, но, по-видимому, this.context не определено?

Answer 1

Я создал EventListener в LoginComponent

Разделение задач.

Извлеките прослушиватель / обработчик push-уведомлений из вашего Login компонента.

Я бы сделал выделенный компонент, один из XXXScreens компонентов (LoginScree, MainScreen и т. Д.), Например:

<Provider store={store}>
  <>   // a shorthand syntax for Fragment
    <PushNotificationsListener></PushNotificationsListener>
    <XXXScreen></XXXScreen>
  </>
</Provider>

Следовательно, ваш прослушиватель push-уведомлений всегда будет активным даже при навигации между экранами,

Кстати, не стесняйтесь использовать response-redux вместе с вашими контейнерами ;это значительно упрощает и оптимизирует обработку избыточности вокруг компонентов React.