DecoupledEditor .create( document.querySelector( '#editor' ), { // toolbar: [ 'heading', '|', 'bold', 'italic', 'link' ] } ) .then( editor => { const toolbarContainer = document.querySelector( 'main .toolbar-container' ); toolbarContainer.prepend( editor.ui.view.toolbar.element ); window.editor = editor; } ) .catch( err => { console.error( err.stack ); } );
时间: 2023-08-09 10:11:24 浏览: 516
这段代码使用了 DecoupledEditor,它是 CKEditor 5 的一个组件,用于将编辑器的 UI 和功能从文本框中分离出来。它允许我们将编辑器插入到任何 DOM 元素中,并通过 API 访问其功能。
首先,调用 `create` 方法创建一个编辑器实例,并将其插入到选择器 `#editor` 所匹配的 DOM 元素中。在这个例子中,我们没有定义任何工具栏按钮,因此编辑器不会显示任何工具栏。
然后,通过 `then` 方法注册一个回调函数,在编辑器成功创建后执行。在此回调函数中,我们将编辑器的工具栏插入到 `.toolbar-container` 元素之前,并将编辑器实例保存到全局变量 `window.editor` 中。
最后,如果出现错误,我们使用 `catch` 方法将错误打印到控制台中。
阅读全文
相关推荐











