redux实际运用

Posted gushixianqiancheng

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了redux实际运用相关的知识,希望对你有一定的参考价值。

import  createStore, applyMiddleware, compose  from ‘redux‘;
import thunkMiddleware from ‘redux-thunk‘;
import rootReducer from ‘reducers/index‘;
import DevTools from ‘containers/DevTools‘

export default function configureStore(preloadedState) 
  const store = createStore(
    rootReducer,
    preloadedState,
    compose(
      applyMiddleware(thunkMiddleware),
      DevTools.instrument()
    )
  )

  if (module.hot) 
    // Enable Webpack hot module replacement for reducers
    module.hot.accept(‘../reducers‘, () => 
      const nextRootReducer = require(‘../reducers‘).default
      store.replaceReducer(nextRootReducer)
    )
  

  return store


function applyMiddleware() 
  for (var _len = arguments.length, middlewares = Array(_len), _key = 0; _key < _len; _key++) 
    middlewares[_key] = arguments[_key];
  

  return function (createStore) 
    return function (reducer, preloadedState, enhancer) 
      var store = createStore(reducer, preloadedState, enhancer);
      var _dispatch = store.dispatch;
      var chain = [];

      var middlewareAPI = 
        getState: store.getState,
        dispatch: function dispatch(action) 
          return _dispatch(action);
        
      ;
      chain = middlewares.map(function (middleware) 
        return middleware(middlewareAPI);
      );
      _dispatch = compose.apply(undefined, chain)(store.dispatch);

      return _extends(, store, 
        dispatch: _dispatch
      );
    ;
  ;


function compose() 
  for (var _len = arguments.length, funcs = Array(_len), _key = 0; _key < _len; _key++) 
    funcs[_key] = arguments[_key];
  

  if (funcs.length === 0) 
    return function (arg) 
      return arg;
    ;
  

  if (funcs.length === 1) 
    return funcs[0];
  

  return funcs.reduce(function (a, b) 
    return function () 
      return a(b.apply(undefined, arguments));
    ;
  );


function createThunkMiddleware(extraArgument) 
  return function (_ref) 
      var dispatch = _ref.dispatch,
          getState = _ref.getState;
      return function (next) 
          return function (action) 
              if (typeof action === ‘function‘) 
                  return action(dispatch, getState, extraArgument);
              

              return next(action);
          ;
      ;
  ;


var thunk = createThunkMiddleware();


function createStore(reducer, preloadedState, enhancer) 
  var _ref2;

  if (typeof preloadedState === ‘function‘ && typeof enhancer === ‘undefined‘) 
    enhancer = preloadedState;
    preloadedState = undefined;
  

  if (typeof enhancer !== ‘undefined‘) 
    if (typeof enhancer !== ‘function‘) 
      throw new Error(‘Expected the enhancer to be a function.‘);
    

    return enhancer(createStore)(reducer, preloadedState);
  

  if (typeof reducer !== ‘function‘) 
    throw new Error(‘Expected the reducer to be a function.‘);
  

  var currentReducer = reducer;
  var currentState = preloadedState;
  var currentListeners = [];
  var nextListeners = currentListeners;
  var isDispatching = false;

  function ensureCanMutateNextListeners() 
    if (nextListeners === currentListeners) 
      nextListeners = currentListeners.slice();
    
  

  function getState() 
    return currentState;
  

  function subscribe(listener) 
    if (typeof listener !== ‘function‘) 
      throw new Error(‘Expected listener to be a function.‘);
    
    var isSubscribed = true;
    ensureCanMutateNextListeners();
    nextListeners.push(listener);

    return function unsubscribe() 
      if (!isSubscribed) 
        return;
      
      isSubscribed = false;
      ensureCanMutateNextListeners();
      var index = nextListeners.indexOf(listener);
      nextListeners.splice(index, 1);
    ;
  

  function dispatch(action) 
    if (!isPlainObject(action)) 
      throw new Error(‘Actions must be plain objects. ‘ + ‘Use custom middleware for async actions.‘);
    
    if (typeof action.type === ‘undefined‘) 
      throw new Error(‘Actions may not have an undefined "type" property. ‘ + ‘Have you misspelled a constant?‘);
    
    if (isDispatching) 
      throw new Error(‘Reducers may not dispatch actions.‘);
    
    try 
      isDispatching = true;
      currentState = currentReducer(currentState, action);
     finally 
      isDispatching = false;
    
    var listeners = currentListeners = nextListeners;
    for (var i = 0; i < listeners.length; i++) 
      var listener = listeners[i];
      listener();
    
    return action;
  

  function replaceReducer(nextReducer) 
    if (typeof nextReducer !== ‘function‘) 
      throw new Error(‘Expected the nextReducer to be a function.‘);
    
    currentReducer = nextReducer;
    dispatch( type: ActionTypes.INIT );
  

  function observable() 
    var _ref;
    var outerSubscribe = subscribe;
    return _ref = 
      subscribe: function subscribe(observer) 
        if (typeof observer !== ‘object‘) 
          throw new TypeError(‘Expected the observer to be an object.‘);
        
        function observeState() 
          if (observer.next) 
            observer.next(getState());
          
        
        observeState();
        var unsubscribe = outerSubscribe(observeState);
        return  unsubscribe: unsubscribe ;
      
    , _ref[result] = function () 
      return this;
    , _ref;
  
  dispatch( type: ActionTypes.INIT );
  return _ref2 = 
    dispatch: dispatch,
    subscribe: subscribe,
    getState: getState,
    replaceReducer: replaceReducer
  , _ref2[result] = observable, _ref2;

 

以上是关于redux实际运用的主要内容,如果未能解决你的问题,请参考以下文章

浅谈redux-form在项目中的运用

React-Native 开发 在react-native 中 运用 redux

React中的状态管理

C#说说 C# 9 新特性的实际运用

Windows下Memcached在.Net程序中的实际运用(从Memcached客户端Enyim的库的编译到实际项目运用) 转发

编程思维在实际生活中的运用!