Question

Redux中的中间件由签名定义

const middleware = store => next => action => {}

动作的定义是什么，应该如何创建？

我想创建一个用于处理异步操作的新中间件，其中的操作可以包含说明要执行的副作用以及成功时要分派的操作的指令。我将中间件设置如下：

const effectMiddleware = store => next => async (action) => {
    // Assert it's actually a command
    if (action.command !== undefined) {
        next(action)
        const result = await Cmd.execute(action.command) // returns a redux action
        return store.dispatch(result)
    else {
        next(action)
    }
}

但是，我遇到了奇怪的错误，无法执行下一个操作。我发现实际上中间件“动作”与您在应用程序中定义的动作不同。使用控制台日志，我发现中间件中的操作实际上是

action: Object { type: "MY_ACTION", payload: {} }

stack: undefined

timestamp: 1571214156244

type: "PERFORM_ACTION"

为什么它不执行Cmd.execute返回的动作。我设法通过创建wrapAction函数来解决此问题：

const wrapAction = (action) =>
    ({ action: action, type: "PERFORM_ACTION", stack: undefined, timestamp: new Date().valueOf() })

const effectMiddleware = store => next => async (action) => {
    // Assert it's actually a command
    if (action.action.command !== undefined) {
        next(action)
        const result = await Cmd.execute(action.action.command) // Cmd.execute returns a Promise<redux action>
        return store.dispatch(wrapAction(result))
    else {
        next(action)
    }
}

但是，我在任何地方都找不到此文档，所以我的问题是：中间件实际上是如何使用的？将动作“包装”到这些中间件动作中的正式方法是什么？

Answer 1

发生这种情况的原因是由于redux devtools！当您使用多个中间件时，redux devtools必须始终排在最后。

Redux中间件操作的功能是什么

1 个答案: