Как программно очистить содержимое поля ввода (sendbox) в окне чата | MS Bot рамки | Прямой бот

Question

Я использую QnAMaker в качестве бота для моего чат-бота, который работает на прямом канале бота. В ситуации я хочу очистить содержимое в поле ввода, для этого я использовал следующую простую JavaScript строку

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

Он очищает содержимое в этот момент, однако он появляется снова, когда мы щелкните внутри поля ввода, чтобы ввести следующий вопрос. Следовательно, содержимое на самом деле не очищается.

Поэтому предложите мне способ, которым я должен программно очищать поле ввода (sendbox) окна чата навсегда.

Answer 1

Вас может заинтересовать этот ответ: Как добавить автозаполнение / автозаполнение в веб-чате Microsoft Botframework с помощью 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 samples , которые могут помочь с использование действий Redux в веб-чате

Вы пытаетесь редактировать содержимое поля отправки без использования хранилища Redux, поэтому веб-чат не знает об изменениях, которые вы пытаетесь внести , Если вы используете действие 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 ="";


} 

спасибо Кайлу Делани за подробное объяснение, основанное на ваших комментариях. Я достиг его.