哪一個在react / redux應用程序中保存服務實例？

Question

假設我在Redux中編寫應用程序，我的任務是使用第三方庫添加日志記錄。 其API如下：

function createLogger(token) {
    // the logger has internal state!
    let logCount = 0;

    return {
        log(payload) {
            logCount++;            // modify local state

            fetch('/someapi', {    // ship payload to some API
                method: 'POST',
                body: payload
            });
        }
    };
}

然后我會使用這樣的庫：

let logger = createLogger('xyz');
logger.log('foobar');

我絕對想在應用程序初始化期間只創建一次logger實例。 但問題是： 我在哪里存儲記錄器實例 ？

第一個是將它放在商店的某個地方。 但這是個好主意嗎？ 正如我在代碼中演示的那樣，logger對象是有狀態的，它在閉包中存儲了一個計數器。 我沒有像使用不可變對象那樣獲得新實例。 我們知道，只應通過純縮減器函數修改狀態。

其他可能性是在redux中間件閉包中的某處創建實例，或者只創建一個全局變量，這在可測試性方面顯然是邪惡的。

是否有最佳實踐（我認為）相當常見的情況？

Answer 1

由於您使用的是ES6模塊，我會將您的記錄器設置為模塊， export其export ，並將其import到您計划使用它的任何位置。 我認為從操作中記錄是一個可靠的計划，因為它保持組件不知道，並且不會污染具有副作用的商店。

function createLogger(token) {
    // the logger has internal state!
    let logCount = 0;

    return {
        log(payload) {
            logCount++;            // modify local state

            fetch('/someapi', {    // ship payload to some API
                method: 'POST',
                body: payload
            });
        }
    };
}

export default const logger = createLogger('xyz');

你的動作創作者

import logger from 'logger-module';

//
logger.log('somestuff');

通過導入記錄器並在其需要攔截的方法上放置任何間諜/存根，仍可輕松實現測試。

Answer 2

從Redux文檔 ：

/**
 * Sends crash reports as state is updated and listeners are notified.
 */
const crashReporter = store => next => action => {
  try {
    return next(action)
  } catch (err) {
    console.error('Caught an exception!', err)
    Raven.captureException(err, {
      extra: {
        action,
        state: store.getState()
      }
    })
    throw err
  }
}

Raven是第三方圖書館。

如果庫有自己的狀態，那么在中間件中使用它不應該是一個問題（狀態屬於庫而不是你的應用程序）。 如果你正在為它創建一個狀態，由於某種原因，那么該狀態應該屬於Redux存儲，可能在store.logger之下。