Quill JS - проверьте, изменяется ли текст в форме отправки - PullRequest
Новая
       26

Quill JS - проверьте, изменяется ли текст в форме отправки

0 голосов
/ 30 апреля 2018

Я использую Quill (Rich Text) и мне нужно найти способ проверить, изменился ли текст, когда страница отправляет форму. Я совершенно новичок в использовании Quill и смотрю на события здесь . Использование триггеров изменения текста каждый раз, когда текст изменяется (очевидно), но у меня есть другие элементы управления вводом формы на странице, которые проверяются при отправке формы, чтобы увидеть, изменились ли они ... Мне нужны мои поля RTF, чтобы сделать то же самое.

EDIT

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

Ответы [ 2 ]

0 голосов
/ 11 мая 2018

Два способа сделать это:

1) прислушайтесь к изменениям пера и, если таковые произошли, поднимите флаг, сообщающий, что содержимое вашей формы изменилось (поток: если вы добавите символ, а затем удалите его, ваш флаг будет иметь значение true, даже если полученный контент будет таким же)

Использование: 

let changes = false
quill.on('text-change', function(delta, oldDelta, source) {
  changes = true
})

2) сравнение двух снимков документа для определения внешнего интерфейса, если произошли изменения. Вы можете сравнить строки (с quill.getText()), это проще всего, но вы можете пропустить множество вещей, я бы порекомендовал сравнивать объекты (с quill.getContents()) и использовать проверку методом lodash или другим методом глубокого равенства.

Использование: 

const initialContents = quill.getContents()
const beforeSubmitContents = quill.getContents()
const hasChanged = _.isEqual(initialContents.ops, beforeSubmitContents.ops)
0 голосов
/ 30 апреля 2018

для обнаружения, если существующее изменение только реализует эту функцию 

quill.on('text-change', function(delta, oldDelta, source) {
  if (source == 'api') {
    console.log("An API call triggered this change.");
  } else if (source == 'user') {
    console.log("A user action triggered this change.");
  }
});

эта функция обнаруживает изменения или изменения в редакторе, обнаруживает изменения в ваших словах, шрифте или изображении ... и т. Д. !! В этом случае я использую пример официальной страницы: Официальная страница результат: Result Example

...