哪一个在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它，以及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');

通过导入记录器并将任何间谍/存根放置在您需要拦截的方法上，仍然可以轻松实现测试。