Редактор перьев: сохраняйте отступы текста при вставке

Недавно я начал использовать 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?

0 ответов

Другие вопросы по тегам