Логика промежуточного ПО Redux

Мне трудно понять промежуточное ПО Redux и то, как именно оно настраивается в магазине Redux. Например, у меня есть следующие примеры

const store = compose(
  resetRedux('LOGOUT_USER'),
  applyMiddleware(...middlewares),
)(createStore)(rootReducer, initialState);

resetRedux — это промежуточное ПО, которое в основном сбрасывает все хранилище избыточности при отправке строки LOGOUT_USER. Это прекрасно работает, однако, если я помещу console.log в промежуточное программное обеспечение resetRedux, оно будет вызываться только один раз, что странно, учитывая, что я полагаю, что действие нужно проверять каждый раз, чтобы иметь возможность решить, следует ли сбрасывать хранить.

export default function resetMiddleware(types = ['RESET']) {
  return (next) => (reducer, initialState) => {
    const resetTypes = Array.isArray(types) ? types : [types];
    console.log('THIS IS ONLY CALLED ONCE??!')
    const enhanceReducer = (state, action) => {
      if (~resetTypes.indexOf(action.type)) {
        state = undefined;
      }
      return reducer(state, action);
    };
    return next(enhanceReducer, initialState);
  }
};

Итак, мне любопытно, как это работает, когда console.log вызывается только один раз.


person Detuned    schedule 02.06.2016    source источник
comment
Дополнительный вопрос: где вы видели этот синтаксис для использования compose() и createStore()? Это действительно, но ужасно, и в последнее время я видел, как оно всплывает в нескольких вопросах. Если это все еще где-то в документах, нам нужно обновить документы, чтобы больше не учить этому. Легче понять синтаксис: createStore(reducer, preloadedState, composedEnhancers)   -  person markerikson    schedule 02.06.2016
comment
Я видел его в использовании, в нескольких стартовых комплектах. Вот почему я пытался понять логику. Мой ответ на предложенный ответ (недостаточный) ниже: Да, я понимаю композицию функций, однако, если вы посмотрите на код выше, не имеет смысла, почему оператор console.log вызывается только один раз. Я бы предположил, что при каждом действии выполняются эти условные проверки, чтобы определить, сбрасывать хранилище избыточности или нет... Более того, если я помещу resetRedux в функцию applyMiddleware, это не сработает. Мне нужно разместить его снаружи и использовать компоновку, как вы видите выше.   -  person Detuned    schedule 02.06.2016


Ответы (2)


Вы путаете и смешиваете «промежуточное ПО» и «усилители магазина». Часть resetRedux, которую вы написали, на самом деле является «расширителем магазина», а не промежуточным программным обеспечением.

Основное тело реального промежуточного ПО будет выполняться для каждого отправляемого действия. Сам усилитель магазина оценивается/выполняется один раз во время создания магазина. reducer, который вы возвращаете, будет выполняться для каждого действия, потому что вы создаете функцию, которая оборачивает любой "настоящий" редьюсер, предоставленный createStore.

В качестве дополнения, Redux Tutorials В разделе #Implementation Walkthroughs моего списка ссылок React/Redux есть несколько статей, объясняющих, как промежуточное ПО работает в Redux.

person markerikson    schedule 02.06.2016
comment
Это абсолютно так! Я ценю обратную связь и почему я был смущен. Я понял, что промежуточные программы обычно применяются, используя функцию applyMiddleware, однако бит кода resetRedux там не работал, поэтому он был вынесен наружу как store enhancer, как вы упомянули. Итак, мне любопытно, как на самом деле работает сброс, поскольку он вызывается только один раз. Кроме того, если было бы лучше перенести его в качестве промежуточного программного обеспечения, как его можно настроить для работы. - person Detuned; 02.06.2016
comment
И промежуточное ПО, и усилитель определяются как фабричные функции. Самой внешней функцией является фабрика, и она выполняется только один раз во время создания магазина. Внутренние методы будут выполняться несколько раз. Функция редуктора enhanceReducer, которую вы определили, будет выполняться каждый раз, когда отправленное действие достигает хранилища, потому что теперь это является единственной функцией редуктора. Внутренняя функция промежуточного программного обеспечения будет выполняться каждый раз, когда действие проходит через конвейер промежуточного программного обеспечения, поэтому у него есть возможность его обработать. Это разница между фабрикой и тем, что фабрика возвращает. - person markerikson; 02.06.2016
comment
Замечательно! Я упустил из виду тот факт, что энхансер действительно вызывался несколько раз. - person Detuned; 03.06.2016

Это то, что делает compose, он берет ваши переданные функции и создает новую функцию, которая «составляет» их.

Аргументы

(аргументы): функции для составления. Ожидается, что каждая функция будет принимать один параметр. Его возвращаемое значение будет передано в качестве аргумента функции, стоящей слева, и так далее. Исключением является крайний правый аргумент, который может принимать несколько параметров, поскольку он обеспечивает сигнатуру для результирующей составленной функции. Возвращает

Возвращает (функция): конечная функция, полученная путем составления заданных функций справа налево.

Вы можете проверить исходный код здесь

Это типичная утилита в функциональном программировании, например. lodash также предоставляет его, подчеркивание также

person Avraam Mavridis    schedule 02.06.2016
comment
Да, я понимаю композицию функций, однако, если вы посмотрите на приведенный выше код, то не поймете, почему оператор console.log вызывается только один раз. Я бы предположил, что при каждом действии выполняются эти условные проверки, чтобы определить, сбрасывать хранилище избыточности или нет... Более того, если я помещу resetRedux в функцию applyMiddleware, это не сработает. Мне нужно разместить его снаружи и использовать compose, как вы видите выше. - person Detuned; 02.06.2016