我在理解reducer和中间件之间的应用程序差异时遇到了一些麻烦。许多网站描述了中间件，甚至给出了精确的定义：
它在分派动作和动作到达reducer之间提供了一个第三方扩展点。
或者：
中间件是通过组合功能来创建的，这些功能 Package 了独立的横切关注点，这些横切关注点不是您的主要执行任务的一部分。
但从这些我所理解的是，有一个区别，只是没有什么。据我所知，区别在于一个采取行动并将该行动传递下去，另一个采取行动和状态并“将状态传递下去”。但是您仍然可以访问中间件中的存储。因此，存储和操作都要经过中间件，然后是reducer。因此reducer可以执行日志记录。
虽然日志似乎是一个明显的中间件应用程序，但还有更多模棱两可的例子。例如，在模块中写入一些简单的身份验证，您可以使用中间件函数来执行用户发送的操作并确定其身份验证级别：
import { getAuthLevel } from './auth';
export default store => next => action => {
return next({...action, auth: getAuthLevel(action.clientId)});
}你可能有一群这样的用户：
{
users: [{
clientId: 'bobsUnqiueClientId',
user: 'Bob',
password: 'ilikecats',
authlevel: 'OVERLORD'
}, {
clientId: 'anotherUniqueClientId',
user: 'Alice',
password: 'boblikescats',
authlevel: 'MINION'
}]}然后，您可能会有对应于不同身份验证级别的操作。您可以使用中间件来Map它，但是您需要了解有关所执行的操作的更具体的细节，并且它看起来更像是“执行相关”的代码。但它不需要知道任何关于状态的信息。它只需要决定将哪些操作转发给reducer。
那么，这样的代码是放在reducer中还是放在中间件中呢？谁能提供其他具体的例子来说明两者之间的区别？
2条答案
按热度按时间2ic8powd1#
reducer是一个函数，它将状态的一部分和当前调度的操作作为参数，并返回更新的状态。多个reducer函数可以组合在一起，形成传递给
createStore()的 root reducer 函数。Reducer应该是“纯函数”，没有“副作用”。这意味着没有 AJAX 调用，没有调度操作，并且（理论上）没有日志记录-只有(state, action) => newState。（现在，你可以在一个reducer中进行日志记录，并且该代码可以正常工作，但作为一个原则问题，这仍然不是reducer应该做的事情。中间件是 Package 存储的
dispatch函数的一段代码。多个中间件可以通过applyMiddleware()增强器变成一个管道。当一个动作被分派时，它将依次通过管道中的每个中间件。每个中间件都可以对动作做任何它想做的事情：记录它、延迟它、修改它、调度其他东西，或者只是沿着管道向前传递它。最后，最后一个中间件将操作传递给实际的store.dispatch()函数，该函数调用根reducer并启动状态更新逻辑。所以，一般来说，中间件提供了一个执行与操作相关的集中逻辑的地方，比如授权检查或日志记录。
你可能想阅读Redux文档中的Structuring Reducers部分，以获得更多关于reducer如何工作和如何组织的例子，我的React/Redux links list有一些讨论Redux middleware和reducer用法的文章。
syqv5f0l2#
中间件在到达reducer之前做一些事情。中间件将等待并且不会执行，直到你从一个api调用中得到响应。中间件监视通过我们的应用程序的操作。因此，如果您将数据从客户端发送到redux store，则流程如下：中间件来分派，然后最终到reducer。