如何以编程方式清除聊天窗口中输入字段（发送框）的内容 | MS Bot 框架 | 直线机器人

Question

我在后端为我的聊天机器人使用 QnAMaker，它在直线机器人频道中运行。在我想清除输入字段中的内容的情况下，为此我使用了以下简单的 JavaScript 行document.querySelector("[aria-label='Sendbox']").value ="";它此时会清除内容，但是当我们在输入字段内单击以键入下一个问题时，它会再次出现。因此内容实际上没有被清除。所以建议我一种方法，我应该以编程方式永久清除聊天窗口的输入字段（发送框）。

Answer 1

您可能对此答案感兴趣：How to add AutoComplete/AutoSuggestion in Microsoft botframework webchat using React.js

网络聊天使用Redux，它有一个可以使用 Redux 中间件的Redux 商店。网络聊天有一个名为的操作 ，可用于响应用户在文本输入框中键入的内容，如下所示：WEB_CHAT/SET_SEND_BOX

const store = window.WebChat.createStore(

    {},

    store => next => action => {

        if (action.type === 'WEB_CHAT/SET_SEND_BOX') {

            const user_entered_text = action.payload.text;

            // Use the text to query the Azure database and display suggestions

        }

        return next(action);

    }

);

当用户单击建议或按右键时，您可以使用相同的操作来更改文本输入框中的内容，如下所示：

store.dispatch({

    type: 'WEB_CHAT/SET_SEND_BOX',

    payload: {

        text: user_selected_suggestion,

    }

});

Web Chat repo 中有一些示例可能有助于在 Web Chat 中使用 Redux 操作

您尝试在不使用 Redux 存储的情况下编辑发送框的内容，因此 Web Chat 不知道您尝试进行的更改。如果您使用WEB_CHAT/SET_SEND_BOX带有空文本的操作，那么您可以正确清除发送框。

Answer 2

该问题的确切解决方案是以下代码。

function clearinput()

{

                    store.dispatch({

                    type: 'WEB_CHAT/SET_SEND_BOX',

                    payload: {

                            text: "",

                         }

                    });

                         document.querySelector("[aria-label='Sendbox']").value ="";

} 

感谢凯尔·德莱尼（Kyle Delaney）的详细解释，根据您的意见，我已经做到了。