当你使用CKEditor时,用户可能会感到前卫并一次粘贴数千行。浏览器不会这样。一种策略是拦截粘贴事件并将数据修整为更易于管理的块。环顾四周,我发现了这个问题-这基本上是相同的情况,我只知道如何使用React组件实现相同的目标。我还要感谢其他不同且更具洞察力的策略。
简而言之,我直接在开发人员的github问题跟踪器中提出了一个问题。在Javascript控制台中出现了很多错误和错误,以及最终的答案,我设法通过粘贴事件控制了CKEditor中的文本。
关键点:
我想解释我所做的最好的方法就是只显示代码,所以:
<CKEditor
id={id}
editor={ClassicEditor}
data={value}
onInit={editor => {
const documentView = editor.editing.view.document
documentView.on('paste', (event, data) => {
editor.plugins.get('Clipboard').on('inputTransformation', (event, data) => {
let accumulated = editor.getData()
for (const element of data.content.getChildren()) {
if (element._textData !== undefined) {
accumulated += element._textData
} else {
accumulated += element.getChild(0)._textData
}
if (accumulated.length >= SOME_LENGTH) {
event.stop()
editor.setData('')
editor.setData(accumulated.slice(0, SOME_LENGTH))
break
}
}
})
})
}}
onChange={(event, editor) => {
const data = editor.getData()
inputOnChange(data)
}}
/>
就是这样了。我希望这可以缩短其他人的工作时间。