如果BotFramework两次发送事件类型的活动，如何使用activitymiddleware。

Question

为了能够在webchat客户端中隐藏sendBox，我的机器人逻辑发送了一个事件来告诉客户端隐藏sendbox。在客户端中，我使用中间件来捕捉这个事件并隐藏或显示sendBox。在控制台，我看到我从机器人发送的每个事件，都被中间件处理了两次，导致了意外的行为。有谁知道如何处理这个问题？

在我的机器人代码中（一个瀑布对话

对话步骤1.和对话步骤2.

const hideSendBox =
  {
     name: 'hideSendBox',
     type: 'event'
  };
await stepContext.context.sendActivity(hideSendBox);
return await stepContext.prompt(PROMPT_THAT_DOES_NOT_NEED_SENDBOX, '');

和对话步骤2。

const showSendBox =
  {
     name: 'showSendBox',
     type: 'event'
  };
await stepContext.context.sendActivity(showSendBox);
return await stepContext.prompt(PROMPT_THAT_DOES_NEED_SENDBOX, '');

和

对话步骤3.

return await stepContext.prompt(PROMPT_THAT_DOES_NEED_SENDBOX, '');

在我的网络聊天代码中

const activityMiddleware = () => next => ({ activity, nextVisibleActivity, ...otherArgs }) => {
    const { name, type } = activity;
    if (type === 'event') {console.log(activity)};
    if (type === 'event' && name === 'hideSendBox') {
      document.getElementsByClassName('main')[0].style.visibility = "hidden";
      return () => <Component1 activity={activity} nextVisibleActivity={nextVisibleActivity} />;
    } else if (type === 'event' && name === 'showSendBox') {
      document.getElementsByClassName('main')[0].style.visibility = "visible";
      return () => <Component2 activity={activity} nextVisibleActivity={nextVisibleActivity} />;
    }
    else {
      return next({ activity, nextVisibleActivity, ...otherArgs });
    }
  };

结果。

1. 在第一个活动被发送后(hideSendbox)，活动中间件得到了事件，sendBox被隐藏了。
2. 在第二个活动被发送后（showSendbox），活动中间件得到第二个事件（sendBox将被显示），之后，又得到第一个事件。结果，sendBox再次被隐藏。
3. 一旦对话继续，其他活动由机器人发送），中间件再次获得第二个事件，sendbox就会被显示。

Answer 1

在 activityMiddleware根据 文件，是为了 "将新的DOM组件添加到当前已有的活动DOM中"。使用这个中间件对于你想做的事情来说是不正确的。

相反，你应该通过Web Chat的商店来实现。当设置如下时，发送框会根据传递进来的事件被隐藏和显示。

请注意。 如果可以避免的话，Web Chat团队强烈反对直接修改DOM。通过直接改变DOM，你会在将来Web Chat组件被大修时为自己打开可能的破坏性改变。

const store = window.WebChat.createStore( {}, ({ dispatch }) => next => action => {
  if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
    const { activity } = action.payload;
    if (activity.type === 'event') {
      if (activity.name === 'hideSendBox') {
        document.getElementsByClassName('main')[0].style.visibility = "hidden";
      } else if (activity.name === 'showSendBox') {
        document.getElementsByClassName('main')[0].style.visibility = "visible";
      }
    }
  }
} );

希望对您有所帮助