Draft.js - отличный фреймворк. Он такой мощный и настраиваемый! И, как и со всеми другими мощными вещами, вы определенно потерялись бы в документации к нему. Более того, в некоторых аспектах он ведет себя иначе, чем другие популярные приложения. Вот небольшая настройка, которую вы можете использовать, чтобы сделать ваше приложение более удобным для пользователя.
Эта проблема
Текстовые редакторы, такие как Gmail, Microsoft Office, Google Docs, MacOS Notes и т. Д., Позволяют пользователям иметь элемент в (не) упорядоченном списке, который занимает более одной строки, путем нажатия Shift+Return. Удивительно, но Draft.js по умолчанию не следует этому шаблону.
Решение
В Draft.js API есть функция handleReturn. Неудивительно, что он используется для обработки return нажатий клавиш. Чтобы поймать определенные комбинации клавиш с помощью клавиши возврата, нам нужно добавить такой обработчик в компонент Editor.
Draft.js также предоставляет нам функцию для обнаружения так называемых событий «мягкой новой строки» - isSoftNewlineEvent, и она находится в draft-js/lib/isSoftNewlineEvent.
Более того, в Draft.js есть функция, которую мы можем использовать для вставки этих «мягких новых строк». Он является частью модуля RichUtils и называется insertSoftNewline. Он принимает текущий EditorState в качестве аргумента и возвращает обновленное состояние с этой «мягкой новой строкой» на его месте.
Итак, все, что нам нужно сделать, это объединить все функции вместе:
Это уловка. Надеюсь, это сэкономит вам время.
P.S. Давайте также проясним эти handled и not-handled строки. Возвращая handled из функции handleReturn, мы сообщаем Draft.js, что мы уже обработали это событие и ему не нужно ничего делать. В противном случае, возвращая not-handled строку, событие будет обработано Draft.js.
P.P.S. Если вы не хотите добавлять этот код в свой проект, вы все равно можете добавить это поведение с помощью плагина.
