CKEditor5 在自定义数据处理器中使用模型

Question

我正在玩 CKEDitor5，我试图创建一个自定义数据处理器。我想在 toData 转换中使用该模型，但该方法是通过 view/DocumentFragment 对象调用的。所以我的问题是如何将其转换为 model/DocumentFragment 对象（或如何从数据处理器访问模型）。

Update（因为它不适合评论）：让我试着更详细地解释一下我到底想做什么（或者到目前为止我已经做了）。我想出了如何使用访问模型本身，但正如您也指出的那样，这似乎是一个糟糕的解决方案。

所以基本上我想创建一个 DataProcessor 来将编辑器数据转换为 BBCode，我想这听起来很合理。

一方面，toView 方法很简单，因为可以假定 BBCode 到 HTML 的转换已经实现（在我的例子中）。从 HTML 看来，加载编辑器数据似乎很简单（通过 Markdown 处理器使用的相同过程）。

另一方面，从模型数据而不是视图转换为 BBCode 似乎更容易。主要是因为 view/DocumentFragment 对象和视图树的其余部分几乎只是 DOM 或 HTML 的另一种表示形式。我真的不关心粗体是 <b> 还是 <strong> 我只是想知道 text 节点是否具有 bold 属性。

通过使用该模型，我希望使用语义而不是 HTML 中使用的表示。基本上将所有 HTML 标签映射到它们的 BBCode 等价物似乎有点毫无意义（即使 CKE5 在提供一致的 HTML 标签方面做得很好）。所以从我的角度来看，使用模型更有意义。从语义表示转换为"data format"比转换为"data format"（查看树，DOM，HTML，莫尔斯电码）然后创建[=46=更容易] 之后

长期以来，阻碍我们使用 RTE 或所见即所得编辑器的正是从 HTML 转换为 BBCode 的困难。现在 CKE5 有了模型，它似乎很容易转换成任何东西，因为它不仅独立于 HTML 格式，而且还独立于编辑器中显示的 HTML （这不能说关于视图树，因为它正是编辑器中的 HTML - 至少它不是 contenteditable 产生的任何东西，但仍然不够好）。

Also：我刚刚制作了一个 Plugin 来设置 DataProcessor，因为这也是 Markdown 功能所做的（在某处的文档）。这是个坏主意吗？

再次感谢您的回答。

Answer 1

最近，一个similar question was raised on CKE5 GitHub。问题是关于获取 JSON 数据作为编辑器输出，但您提出的主题也被部分涵盖。

(...) how to access the model from a data processor

直接在模型上操作存在一定的问题和风险。这不是推荐的东西。在链接 post.

中有解释

(...) my question is that how could I convert that into a model/DocumentFragment

与直接在模型上操作相比，这是一种更好（风险更小）的方法。但是，我不得不问 - 为什么要从模型转换？也许有更好的解决方案来解决您的问题？

要在视图和模型之间转换，必须使用 DataController#toView 和 DataController#toModel。 DataController 个实例在 Editor#data 可用。要在数据处理器中使用它，数据处理器需要访问编辑器实例。

我建议创建您自己的编辑器 class，扩展其中一个 CKE5 编辑器 classes。然后，在新的编辑器 class 构造函数中，覆盖数据处理器并传递编辑器实例。类似于：

class MyEditor extends ClassicEditor {
  constructor() {
    this.data.processor = new MyDataProcessor( this );
  }
}

class MyDataProcessor() {
  constructor( editor ) {
    this._editor = editor;
  }

  toData( viewDocumentFragment ) {
    const modelDocumentFragment = this._editor.data.toModel( viewDocumentFragment );
    // ...
  }

  toView( modelData ) {
    // ...
    this._editor.data.toView( ... );
    // ...
  }
}

这些只是为了显示方向，而不是 working/tested 个样本。

不过，我想知道您为什么坚持使用模型而不是视图来生成编辑器输出。

顺便说一句。如果你继续像这样实现它，整个过程会有点傻:)。首先，您将获得一个模型数据，然后将其转换为视图（在数据处理器中），然后编辑器将获取视图数据并将其转换回模型:)。所以也许你也会对覆盖 Editor#setData 方法感兴趣，这样就不会发生不必要的转换。

CKEditor5 在自定义数据处理器中使用模型

CKEditor5 use model in custom Data Processor

ckeditor

ckeditor5