1

我正在尝试创建一个 CKEditor5 自定义元素插件 - 主要用于自定义格式/样式 - 嵌套 div 等。管理能够注入/格式化元素，我可以输入它们。但是，如果我尝试将文本复制并粘贴到自定义元素中，则会出现太多递归错误。

MyWidget 插件：

export default class MyWidgetPlugin extends Plugin {

  init() {

    const editor = this.editor;

    editor.model.schema.register('my-widget', {
      inheritAllFrom: '$root',
      isLimit: true,
    });

    editor.conversion.elementToElement({ model: 'my-widget', view: 'my-widget' });
    editor.commands.add('myWidget', new MyWidgetCommand(editor));

  }

}

MyWidget 命令：

class MyWidgetCommand extends Command {

  execute() {

    const editor = this.editor;
    const block = first(this.editor.model.document.selection.getSelectedBlocks());

    this.editor.model.change(writer => {

      const myWidget = writer.createElement('my-widget')
      writer.insert ( myWidget, block, 'after');
      writer.appendElement( 'paragraph', myWidget );

    });

  }

}

插入一个小部件会将其注入编辑器：

<my-widget>
  <p></p>
</my-widget>

我可以打字很好，但我不能粘贴。我猜我的架构错了……玩了很多不同的选择……但无济于事。

铬控制台

4

1 回答 1

1

我没有检查它，但我认为问题出在这里：

editor.model.schema.register('my-widget', {
  inheritAllFrom: '$root',
  isLimit: true,
});

这个模式规则说这<my-widget>将允许例如 a<paragraph>在它里面。但它没有说明<my-widget>可以在哪里使用。那是因为$root不允许在任何其他元素中使用（因为它是根 :)）。

我认为以下应该可以正常工作：

editor.model.schema.register('my-widget', {
  inheritAllFrom: '$root',
  allowIn: '$root',
  isLimit: true,
});

或者，更通用的解决方案也应该起作用：

editor.model.schema.register('my-widget', {
  inheritAllFrom: '$root',
  allowWhere: '$block',
  isLimit: true,
});

尽管如此，编辑器不应该因无限循环而崩溃，所以我报告了https://github.com/ckeditor/ckeditor5-engine/issues/1441。

于 2018-06-22T09:47:13.370 回答