Question

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

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

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

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

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

通过使用该模型，我希望使用语义而不是HTML中使用的表示。基本上将所有HTML标签映射到他们的BBCode等价物似乎有点无意义（即使CKE5在提供一致的HTML标签方面做得很好）。所以从我的角度来看，使用模型更有意义。从语义表示转换为＆＃34;数据格式＆＃34;比转换为＆＃34;数据格式更容易＆＃34; （查看树，DOM，HTML，摩尔斯电码），然后创建一个＆＃34;表示图＆＃34;之后。

很长一段时间阻止我们使用RTE或WYSIWYG编辑器的确是从HTML转换为BBCode的难度。现在CKE5有了模型，它似乎很容易转换成任何东西，因为它不仅是HTML格式的独立，而是编辑器中显示的HTML（这不能说是视图树，因为它完全是HTML中的编辑 - 至少它不是满足任何可能产生的，但仍然不够好。）

同样：我刚刚设置Plugin来设置DataProcessor，因为Markdown功能也是如此（在某处的文档中）。这是个坏主意吗？

再次感谢您的回答。

Answer 1

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

（...）如何从数据处理器访问模型

在模型上直接操作存在某些问题和风险。这不是推荐的东西。它在链接的帖子中有解释。

（...）我的问题是如何将其转换为model/DocumentFragment

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

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

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

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( ... );
    // ...
  }
}

这些只是为了显示方向，而不是工作/测试样本。

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

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

CKEditor5在自定义数据处理器

1 个答案: