Остановить повторную визуализацию чатов - PullRequest
Новая
       8

Остановить повторную визуализацию чатов

0 голосов
/ 21 июня 2019

Я столкнулся с проблемой, связанной с процессом рендеринга в чат-боте.Вот проблема:

Я создал функцию, которая возвращает строку (поддерживается HTML), которая будет отформатирована как HTML.Итак, вот utils.ts: 

export function formaterForUi(text: string) {

function Video() {
    formattedMessage = text.replace(/\!\[Video\]\((((https?\:\/\/)|(www\.))(\S+))/gi,
      function (fullText) {
        let fromHttp = fullText.substring(9)
        return fromHttp.replace(/((https?\:\/\/)|(www\.))(\S+)/gi,
          function (videoURLWithLastCharacter) {
            let videoUrl = videoURLWithLastCharacter.substring(0, videoURLWithLastCharacter.length - 1);
            return '<div style="max-width: 600px; margin:7px 0px;"><video style="height: auto; width:100%;" controls><source src="' + videoUrl + '" type="video/mp4"></video></div>'
          })
      });
  }

vedio();

return formattedMessage;
}

Эта функция найдет упомянутое регулярное выражение из входной строки и отформатирует его как видео в HTML (GUI).

Итак, вотОсновной файл .tsx в трафарете. 

formatChatMessages() {
      let count = 0
      while (count < this.chats.length) {
         this.chatBubbleElement.shadowRoot.querySelector("#chat-id-" + (count)).innerHTML = formaterForUi(this.chats[count].message, this.sorryMessageArray)
        count++
      }
  }

Здесь есть несколько ответов на видеочаты, поэтому каждый раз, когда эта функция отформатирует их, может поддерживать браузер. "чаты" - это массив, содержащий все ответы 

  componentDidUpdate() {
    this.formatChatMessages()
   }

И я вызываю эту конкретную функцию (formatChatMessages ()) в жизненном цикле ComponentDidUpdate.Поэтому каждый раз, когда я набираю что-то в текстовом поле, он перерисовывает все видеочаты в течение доли времени.Вы можете видеть, что запросы продолжают отправляться на вкладке Сеть в Инструментах разработчика в Chrome.

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

Пожалуйста, предоставьте решение здесь

...