Редактор перьев: сохраняйте отступы текста при вставке
Недавно я начал использовать HTML-редактор Quill для составления писем. Вот почему мне нужны встроенные стили. Вывод отлично работает с атрибуторами. Я получаю следующий вывод, когда добавляю текстовые отступы:
<div>In</div><div style="text-indent: 1em;">den</div><div style="text-indent: 2em;">ta</div><div style="text-indent: 3em;">tion</div>
Дельта-объект Quill выглядит немного иначе, чем я ожидал, но это нормально, если HTML верен:
content: Delta = {
ops: [
{ insert: "In\nden" },
{ insert: "\n", attributes: { indent: "1em" } },
{ insert: "ta" },
{ insert: "\n", attributes: { indent: "2em" } },
{ insert: "tion" },
{ insert: "\n", attributes: { indent: "3em" } },
]
}
Когда я копирую и вставляю содержимое в тот же редактор перьев, я не получаю ожидаемый результат:
<div>In</div><div> den</div><div> ta</div><div> tion</div><div><br></div>
Со следующим объектом Delta:
content: Delta = {
ops: [
{ insert: "In\n\tden\n\tta\n\ttion\n\n" }
]
}
Я отслеживал действие вставки, используя средство сопоставления в модуле буфера обмена Quill, где отступ правильно распознается:
<div>In</div>
{
ops: [{ insert: "In\n" }]
}
<div style="text-indent: 1em;">den</div>
{
ops: [
{ insert: "\t" },
{ insert: "den\n", attributes: { indent: "1em" } },
]
}
<div style="text-indent: 2em;">ta</div>
{
ops: [
{ insert: "\t" },
{ insert: "ta\n", attributes: { indent: "2em" } },
]
}
<div style="text-indent: 3em;">tion</div>
{
ops: [
{ insert: "\t" },
{ insert: "tion\n", attributes: { indent: "3em" } },
]
}
Как я могу убедиться, что дельты модуля буфера обмена (включая атрибуты отступа) передаются в содержимое редактора quill?