我正在嘗試實現解耦文檔 ckeditor5 以與自定義構建插件做出反應，但我總是看到 classis 構建編輯器

Question

當我使用它時，我只獲得了 classis 構建視圖，我已經嘗試從 package 安裝和使用 DecoupleEditor，它只顯示 classis 構建視圖 import DecoupledEditor from '@ckeditor/ckeditor5-build-decoupled-document'；

import { CKEditor } from "@ckeditor/ckeditor5-react";
import Editor from "ckeditor5-custom-build/build/ckeditor";

function App() {
  let editorr = null;
  return (
    <div className="App">
      <CKEditor
        onReady={(editor) => {
          console.log("Editor is ready to use!", editor);
          editor.ui
            .getEditableElement()
            .parentElement.insertBefore(
              editor.ui.view.toolbar.element,
              editor.ui.getEditableElement()
            );
          editorr = editor;
        }}
        onError={(error, { willEditorRestart }) => {
         
          if (willEditorRestart) {
            editorr.ui.view.toolbar.element.remove();
          }
        }}
        onChange={(event, editor) => console.log({ event, editor })}
        editor={Editor}
        data="<p>Hello from CKEditor 5's decoupled editor!</p>"
      />
    </div>
  );
}

export default App;

文件夾結構在此處輸入圖像描述

前端視圖

Answer 1

找到答案我需要添加文檔編輯器CSS文件來查看更改。