BotFramework WebChat-示例14-两个Redux商店的中间件？

在这个问题之前，我会提到我对React和Redux都是新手

我正在使用BotFramework WebChat示例中的示例14

此外，为了通过管道化Redux操作活动来更改UI，我还希望包括侦听用户界面的中间件 “DIRECT_LINE/CONNECT_Completed”，然后发送带有“webchat/join”负载的“WEB_CHAT/SEND_EVENT”，以便我可以显示欢迎消息

我试图修改dispatchIncomingActivityMiddleware.js，使其如下所示：

export default function (dispatch) {
  return () => next => action => {
    if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
      const { activity } = action.payload;
      if (
        activity.type === 'event'
        && activity.from.role === 'bot'
        && activity.name === 'redux action'
      ) {
        dispatch(activity.value);
      }
    } else if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
        dispatch({
          type: 'WEB_CHAT/SEND_EVENT',
          payload: {
            name: 'webchat/join',
            value: {
              language: window.navigator.language
            }
          }
        });
    } 

    return next(action);
  };
}

---

不用说，它不起作用。我认为这是因为现在所有的操作都被发送到第二个app Redux商店，而不是Web聊天Redux商店。我的问题是，我如何让它同时做到这两个方面？是否有方法将某些操作发送到app Redux商店，并将其他操作发送到Web聊天室商店？有没有其他方法可以实现这一点？

一个具有两个属性的对象-

dispatch

和

getState

-被传递到存储中间件。您应该从传入对象访问

dispatch

属性，或者在函数头中解构它。尝试：

export default function ({ dispatch }) {
    return ....
}

---

此外，Web聊天中的欢迎消息行为也略有改变。请查看以了解更多详细信息

@tdurnford感谢您的回复。通过在WebChat.js中添加以下内容，我最终实现了这一点：

constructor(props) {
    super(props);

    this.store = createStore(
      {},
      ({ dispatch }) => next => action => {
        if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
            dispatch({
              type: 'WEB_CHAT/SEND_EVENT',
              payload: {
                name: 'webchat/join',
                value: {
                  language: window.navigator.language
                }
              }
            });
        } 

        return next(action);
      },
      dispatchIncomingActivityMiddleware(props.appDispatch)
    );

    this.state = {};
  }

现在，我可以将操作发送到Web聊天redux存储和第二个自定义redux存储。耶！我还有一个问题，你能解释一下这个例子中

{dispatch}

和

props.appDispatch

之间的区别吗？后者似乎来自index.js中的原始声明：

ReactDOM.render(
  <Provider store={ store }>
    <App />
  </Provider>,
  document.getElementById('root')
);

ReactDOM.render(
,
document.getElementById（'root'））
);

---

但是在WebChat.js中，

{dispatch}

到底指的是什么呢？

将解决方案标记为已被接受的解决方案将服务于更大的堆栈溢出社区和任何有类似问题的人。如果你觉得我的回答足够，请“接受”它。如果没有，让我知道我还能提供什么帮助！