使内容可编辑成为受控输入

时间:2021-03-06 19:39:08

标签: contenteditable wysiwyg rich-text-editor

在过去的几个月里,我涉足了 javascript 中的富文本编辑器,从 draftjsslatejs 等流行库到尝试从头开始构建(不建议)。出现了一个我仍然不知道答案的问题:您能否使 contenteditable 元素成为真正受控的输入?也就是说,您能否始终在元素更新之前拦截传入的值/更改并操纵该值?

在尝试完成此操作时,需要处理一些事件 - droppaste 等。您似乎无法将 change 事件侦听器用于 { {1}},但有 contenteditableinput 等事件可用于类似目的。然而,每一个都伴随着一些细微差别和挑战。

有人可以提供任何建议/经验吗?感觉这应该是一个已解决的问题,但我无法以跨浏览器的一致方式解决它。就上下文而言,我为此所做的大部分努力都集中在 keypress 上,我需要的核心功能集是:

  • 基本文本格式(粗体、斜体、标题、项目符号列表)
  • @提及(当你按下 react 时你会在 Slack 中得到什么)

0 个答案:

没有答案
相关问题