使用 Promise 进行 CKEditor 5 模型转换

Question

我正在创建一个 CKEditor 5 插件，它必须根据 REST 调用的结果显示一个列表。我用以下方式注册了我的架构项目：

editor.model.schema.register('myItem', {
  allowIn: '$root',
  isBlock: true,
  isObject: true
});

然后添加转换器：

editor.conversion.for('upcast').add(upcastElementToElement({
  view: {
    name: 'div',
    classes: 'myItem'
  },
  model: 'myItem'
}));
editor.conversion.for('dataDowncast').add(downcastElementToElement({
  model: 'myItem',
  view: (modelElement, viewWriter) => {
    return getContent(modelElement, viewWriter);
  }
}));
editor.conversion.for('editingDowncast').add(downcastElementToElement({
  model: 'myItem',
  view: (modelElement, viewWriter) => {
    const div = getContent(editor.model, viewWriter);

    return toWidget( div, viewWriter, { label: 'widget label' } );
  }
}));

我的 getContent 方法负责通过 REST 调用获取数据。我的问题是，如果我使用 axios 或 fetch 来获取数据，它 returns 是一个 Promise，我不知道如何将结果传递给传递给 downcastElementToElement 方法的对象的 'view' 属性。此 'view' 属性需要一个 returns 对象显示的函数。有办法实现吗？

Answer 1

CKEditor 5 不支持异步转换。它会使转换复杂化，并且会提供糟糕的体验，因为在获取期间需要锁定编辑器。我建议创建一个同步转换，然后在获取后用数据库中的特定元素替换它。

使用 Promise 进行 CKEditor 5 模型转换

CKEditor 5 model conversion with Promise

javascript

ckeditor

ckeditor5