Возможно ли изменить поведение contentEditable?

Question

[LosTinCode]

Приветствую!

Хочу понять, возможно ли поменять поведение атрибута contentEditable.

Суть такая, хотелось бы задать родителю атрибут contentEditable, но чтобы текст добавлялся именно в дочерний элемент, т.е в тег p.
Погуглил, ничего путного не нашел, вообще возможно ли это? Или же придется задавать именно тегу p атрибут и по-другому никак? Может есть варианты перехватывать введенный текст и передавать дочернему элементу?

Если у кого то будет статья полезная на эту тему, буду признателен очень! Либо подскажет вкратце как лучше поступить для данной реализации, без сторонних библиотек.

<div className={styles.editorText} contentEditable={true}>
        <p></p>
</div>

Comments

[szQocks]

а чё за ситуация такая ? которая требует решение через одно место

[LosTinCode]

szQocks, Да мне просто для себя понять, как это сделать. По мониторил онлайн редакторы, у них как раз тот результат, который и я бы хотел понять как сделать

Пока что я пришел только к такому решению:

<div className={styles.editorText}
contentEditable
spellCheck="true"
ref={editorRef}
dangerouslySetInnerHTML={{ __html: `<p>${editorRef.current.innerHTML}</p>` }}
>
</div>

[szQocks]

LosTinCode, ну то что ты написал работает так как ожидаешь ? если да - то в чём проблема ? сомневаешься в своём коде или что ?

[szQocks]

LosTinCode, у тебя кстати таким подходом, доступа к p нет

[Kentavr16]

LosTinCode, очень часто при изучении новой технологии человек ищет решения тех проблем, которых на самом деле и нет. Вроде как пытаешься влезть в окно при открытой двери. это я по своему опыту.

Answer 1

[Aetae]

Поменять поведение - нельзя.
Отслеживать изменения и переписывать - можно, но не нужно.