如何从CKEditor 5实例获取数据 [英] How to get data from CKEditor 5 instance

查看:936
本文介绍了如何从CKEditor 5实例获取数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我知道对于CKEditor 4,您可以这样获得文本区域数据:

I know that for CKEditor 4, you can get the textarea data like this:

var content = CKEDITOR.instances['comment'].getData();

如何为CKEditor 5完成?

How is this done for CKEditor 5?

推荐答案

您可以在基本API 指南。

基本上,在CKEditor 5中没有单个全局编辑器存储库(例如旧的 CKEDITOR.instances 全局变量)。这意味着您需要保留对创建的编辑器的引用,并在想要检索数据后使用该引用:

Basically, in CKEditor 5 there's no single global editors repository (like the old CKEDITOR.instances global variable). This means that you need to keep the reference to the editor that you created and use that reference once you'll want to retrieve the data:

ClassicEditor
    .create( document.querySelector( '#editor' ) )
    .then( editor => {
        editor.getData(); // -> '<p>Foo!</p>'
    } )
    .catch( error => {
        console.error( error );
    } );

如果您需要在其他情况下检索数据(谁会在初始化编辑器后立即读取数据) ,对吗?;)),然后将对编辑器的引用保存在应用程序状态的某些共享对象或范围中的某些变量中:

If you need to retrieve the data on some other occasions (who would read it just after initializing the editor, right? ;)), then save the reference to the editor in some shared object of your application's state or some variable in the scope:

let theEditor;

ClassicEditor
    .create( document.querySelector( '#editor' ) )
    .then( editor => {
        theEditor = editor; // Save for later use.
    } )
    .catch( error => {
        console.error( error );
    } );

function getDataFromTheEditor() {
    return theEditor.getData();
}

请参阅此JSFiddle: https://jsfiddle.net/2h2rq5u2/

See this JSFiddle: https://jsfiddle.net/2h2rq5u2/

编辑:需要管理多个编辑器实例,请参见 CKEDITOR 5获取编辑器实例

If you need to manage more than one editor instance, see CKEDITOR 5 get editor instances.

这篇关于如何从CKEditor 5实例获取数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆