如何在 CKEditor5 中设置选择或元素以从执行的函数中添加代码？

问题描述

我在 Grav 中使用 ckeditor 5（命名为 nextgenEditor）并尝试通过 javascript 管理内容（动态添加菜单项等）。但是，当我尝试从 execute writer.setSelection(test,'in'); 中选择要插入代码的元素时，控制台中会显示错误：

ckeditorerror.js:64 Uncaught TypeError: Cannot read property 'parent' of undefined
    at Function._createBefore (position.js:986)
    at ei.createPositionBefore (model.js:661)
    at bn.createPositionBefore (writer.js:627)
    at command.js:94
    at ei.change (model.js:178)
    at r.value (command.js:13)
    at r.<anonymous> (observablemixin.js:255)
    at r.fire (emittermixin.js:221)
    at r.<computed> [as execute] (observablemixin.js:259)
    at jt.execute (commandcollection.js:69)

我的代码：

class MenuClass {
  constructor(divClass) {
      this._divClass = divClass;
      this._allChildren = [];
  }
  
   addItem() {
    const root = nextgenEditor.editor.model.document.getRoot();
    nextgenEditor.editor.model.change(writer => {
      var element = this.#searchChildByKey('name','shortcode-block-editable',false);

      var ul = writer.createElement( 'ul',{ class: 'navbar-nav mr-auto mb-2 mb-lg-0',id: 'menu-left' } );
      var li = writer.createElement( 'li',{ class: 'nav-item' } );
      writer.append(li,ul);
      writer.insert( ul,element );

      this._allChildren = [];
      var test = this.#searchChildByKey('class','nav-item');
      console.log(test);
      writer.setSelection(test,'in');

      nextgenEditor.editor.execute( 'shortcode_menuitem');
    });
  }

  removeItem(myValue) {
    console.log(myValue);
  }

  #searchChildByKey(key,value,attr = true){
    var result;
    if (this._allChildren .length === 0) this.#getAllChildren();
    for ( var child of this._allChildren ){
      if(attr){
        result = this.#childAttRSSearch(result,key,child);
      }else{
        result = this.#childRootSearch(result,child);
      }
      if (result) return result;
    }
  }

  #childAttRSSearch(result,child){
    child._attrs.forEach(function(sValue,sKey) {
      if(sKey == key && sValue == value ){ 
        result = child;
        return false;
      }
    });
    return result;
  }

  #childRootSearch(result,child){
    if(child[key] == value){
      result = child;
    }
    return result;
  }

  #getAllChildren(item = nextgenEditor.editor.model.document.selection.getSelectedElement()){
    var children = [];
    if (item._children){ 
      children = item.getChildren();
    }
    for ( var child of children ){
      this._allChildren.push(child);
      this.#getAllChildren(child);
    }
  }
  
} 

内部方法addItem： 我只想将 execute 函数中的代码插入到添加的元素 (ul li) 中...非常感谢您的任何建议

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）