在Vue.js中设置CKEditor高度[重复]答案

【问题标题】：Set CKEditor height in Vue.js [duplicate]在Vue.js中设置CKEditor高度[重复]
【发布时间】：2019-05-24 21:55:43
【问题描述】：

我在 Vue.js 中尝试ckeditor5，遇到了无法手动设置高度的问题，下面是我的代码，如果我做错了什么请告诉我。

<ckeditor :editor="editor" v-model="editorData" :config="editorConfig"></ckeditor>

data() {
        return {
            editor: Editor,
            editorData: '',
            editorConfig: {
                height: '500px'
            }
        }

【问题讨论】：

标签： css vue.js vuejs2 ckeditor vue-component

【解决方案1】：

经典编辑器（CKEditor 5）不再将编辑区域封装在一个中，这意味着可以使用 CSS 轻松控制编辑区域的高度（和类似选项）。例如，可以通过以下方式实现高度设置：

<style>
  .ck-editor__editable {
    min-height: 500px;
   }
</style>

或

.ck-content { height:500px; }.

2020 注意：在使用单页 Vue 组件时，不要限定要添加到 ckeditor 的 CSS，因为它的元素是与 Vue 分开呈现的，并且没有向它们添加任何数据属性。换句话说，不要这样做，因为它不起作用：

<style scoped> /* don't add "scoped"; note that this will also globalize the CSS for all editors in your project */
    .ck-editor__editable {
        min-height: 5000px;
    }
</style>

【讨论】：