效果

npm安装

npm i ckeditor4-vue

使用方式

<template>
    <ckeditor id="ckeditor" v-model="content" :config="editorConfig"></ckeditor>
</template>
<script>
import CKEditor from 'ckeditor4-vue';
export default {
  components: {
        ckeditor: CKEditor.component
    },   
   data() {
        content: '',
        editor: '',
            editorConfig: {
                language: 'zh-cn',
                toolbar: [
                    {
                        name: 'styles',
                        items: ['RemoveFormat']
                    },
                    {
                        name: 'paragraph',
                        items: [
                            'Format',
                            'NumberedList',
                            'BulletedList',
                            '-',
                            'Indent',
                            'Outdent',
                            '-',
                            'JustifyLeft',
                            'JustifyCenter',
                            'JustifyRight'
                        ]
                    }
                ]
            }   
   }
}
</script>
<style lang="scss" scoped>
/* 修改编辑器默认高度*/
.ck-editor__editable {
    min-height: 400px !important;
}
</style>