Redux: Есть ли какой-нибудь умный способ избежать антипаттерна импорта хранилища для вспомогательных файлов? - PullRequest
Новая
       33

Redux: Есть ли какой-нибудь умный способ избежать антипаттерна импорта хранилища для вспомогательных файлов?

0 голосов
/ 24 сентября 2018

В настоящее время я создаю приложение React Native, используя Redux для управления состоянием и Firebase Cloud Messaging для общения в реальном времени.

Чтобы использовать FCM в фоновом режиме на Android , требуется создать файл с именем bgMessaging.js. 

// @flow
import firebase from 'react-native-firebase';
// Optional flow type
import type { RemoteMessage } from 'react-native-firebase';

export default async (message: RemoteMessage) => {
    // handle your message

    return Promise.resolve();
}

Моя проблема в том, что мне нужно отправить действие здесь.Единственное решение, которое я нашел для этого, было импортировать мой магазин и позвонить store.dispatch().Мне сказали, что это анти-шаблон и считается плохой практикой.Что еще я мог сделать, если бы не анти-паттерн?

Редактировать: Сам Марк Эриксон был так добр и высказал свое мнение по этой теме .Спасибо Марк!

Ответы [ 2 ]

0 голосов
/ 25 сентября 2018

Я также столкнулся с тем же сценарием, когда писал свое приложение.Мой подход к моему React Native App заключался в создании React Components, но я имел дело со значительной частью извлечения / обработки моих данных вне React Components - потому что я не знал, буду ли я использовать React все время, но хотелсоздавать повторно используемые модули для моих других проектов Type / JavaScript.Например, я создал несколько вспомогательных файлов, которые имели дело с различными API, но когда я интегрировал Redux в свой проект - у меня возникла та же проблема.Как мне отправлять без повторного добавления в ваш магазин (как я вижу, это можно рассматривать как Anti-Pattern).

Читая в нескольких статьях, нет реального места, чтобы предположить, что этот подход - «Anti Pattern».».Чаще всего магазины импортируются в контексте React (а это не обязательно) - это Anti Pattern.В вашем случае использования я не очень понимаю, как это может быть Anti Pattern, я, конечно, пришел к такому выводу, когда делал то же самое.На мой взгляд, «общие» части приложения должны использоваться многими другими частями приложения.

0 голосов
/ 25 сентября 2018

Я вижу, что вам нужно предоставить функцию с единственным аргументом, типизированным как RemoteMessage, который возвращает обещание, и вам нужно предоставить эту функцию для registerHeadlessTask (обернутой в другую функцию для некоторыхпричина ..)

Так что, если ваш файл bgMessaging выглядит следующим образом .. 

// @flow
import firebase from 'react-native-firebase';
// Optional flow type
import type { RemoteMessage } from 'react-native-firebase';

export default store => {
  return async (message: RemoteMessage) => {
    // handle your message
    store.dispatch();
    return Promise.resolve();
  }
}

и в вашем индексе вы сделали .. 

import bgMessaging from './src/bgMessaging';

const store = redux.createStore();

const bgMessagingFn = bgMessaging(store);

// Current main application
AppRegistry.registerComponent('ReactNativeFirebaseDemo', () => bootstrap);
// New task registration
AppRegistry.registerHeadlessTask('RNFirebaseBackgroundMessage', () => bgMessagingFn);
...