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

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

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

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

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


javascript botframework direct-line-botframework
person Jegan Baskaran    schedule 09.03.2020    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Возможно, вас заинтересует этот ответ: Как добавить AutoComplete / AutoSuggestion в веб-чат Microsoft botframework с помощью React.js

Веб-чат использует Redux с Redux store, который может использовать промежуточное ПО Redux. В веб-чате есть действие под названием WEB_CHAT/SET_SEND_BOX < / a>, который можно использовать для ответа на то, что пользователь вводит в поле ввода текста следующим образом:

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,
    }
});

Есть образцы в репозиторий веб-чата, который может помочь с использованием действий Redux в веб-чате

Вы пытаетесь редактировать содержимое поля отправки без использования хранилища Redux, поэтому веб-чат не знает об изменениях, которые вы пытаетесь внести. Если вы используете действие WEB_CHAT/SET_SEND_BOX с пустым текстом, вы можете правильно очистить поле отправки.

person Kyle Delaney    schedule 09.03.2020
comment
спасибо за подробное объяснение, я нашел решение на основе вашего ввода. - person Jegan Baskaran; 10.03.2020

arrow_upward
0
arrow_downward

Точное решение проблемы - это следующий фрагмент кода.

function clearinput()
{

                    store.dispatch({
                    type: 'WEB_CHAT/SET_SEND_BOX',
                    payload: {

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


}

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

person Jegan Baskaran    schedule 10.03.2020
comment
Вам не нужна document.querySelector часть - person Kyle Delaney; 10.03.2020