<template>
  <div id="app1">
    <ckeditor :editor="state.editor" v-model="state.editorData" :config="state.editorConfig"></ckeditor>
  </div>
</template>

<script setup name="CkEditor">
import { reactive, shallowRef, watch, onBeforeUnmount } from 'vue';
import CKEditor from '@ckeditor/ckeditor5-vue';
const ckeditor = CKEditor.component;
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';

const state = reactive({
  editor: ClassicEditor,
  editorData: '<p>Content of the editor.</p>',
  editorConfig: {
    // The configuration of the editor.
  }
})

</script>