CKEditor 5中如何在drop事件中获取模型位置用于插入操作

在drop事件回调里，你可以通过编辑器的编辑层映射器将视图范围转换为模型范围，具体代码如下：

documentView.on('drop', function(event, data) {
    // 将视图范围转换为模型范围
    const modelRange = editor.editing.mapper.mapViewToModel(data.dropRange);
    // 获取用于插入的模型位置（此处取范围的起始位置）
    const insertPosition = modelRange.start;

    // 使用writer执行插入操作
    editor.model.change(writer => {
        const newElement = writer.createElement('your-element-name');
        writer.insert(newElement, insertPosition);
    });
});

关键说明： #

• editor.editing.mapper是负责视图与模型之间位置/范围转换的核心工具
• mapViewToModel()方法可接受视图范围或单个视图位置作为参数，返回对应的模型范围/位置
• 得到模型位置后，即可配合writer完成模型层的插入、修改等操作

内容的提问来源于stack exchange，提问作者MTilsted