使用多 applyMiddleware 反应 Redux

Posted 2023-02-22

【中文标题】使用多 applyMiddleware 反应 Redux

【英文标题】：React Redux with multi applyMiddleware

【发布时间】：2018-03-07 07:47:41

【问题描述】：

我想用下面的答案 Redux state persistence with a database

import createStore, compose, applyMiddleware from 'redux';

const localStorageMiddleware = (getState) => 
  return (next) => (action) => 
    const result = next(action);
    localStorage.setItem('applicationState', JSON.stringify(
      getState()
    ));
    return result;
  ;
;

const store = compose(
  applyMiddleware(
    localStorageMiddleware
  )
)(createStore)(
  reducer,
  JSON.parse(localStorage.getItem('applicationState'))
)

但我不明白这里的 javascript 语法 他是怎么用compose(argument)(createStore)(argument)的？

有没有像createStore(reducer,initialState,compose(argument))这样的替代品？

还有，这里如何传递初始状态

const createStoreWithMiddleware = compose(  
  applyMiddleware(thunkMiddleware)
)(createStore);

export default function configureStore(initialState)   
  const store = createStoreWithMiddleware(rootReducer);
  return store;

【问题讨论】：

compose 返回一个与第一个参数具有相同签名的函数 - createStore，然后使用第二个参数调用该函数。 - reducer 和初始状态

@ReiDien 有没有关于 javascript 中这种语法的教程？

我没有。也许只是对功能的深入了解可以帮助您解决并发症

【参考方案1】：

是的！ enhancer()(createStore) 语法是使用 createStore 的旧式方式，我们正努力鼓励人们改用新式语法：

const composedEnhancers = compose(
    firstEnhancer,
    secondEnhancer
);

const store = createStore(
    rootReducer,
    preloadedState,
    composedEnhancers
);

【讨论】：

你知道像 func1(arg)func2(arg) 这样的 javascript 函数的来源吗？

这是一种称为“currying”的函数式编程方法，或者可能只是一个返回另一个函数的函数。我有一些可能有用的articles on Functional Programming concepts 的链接。