CKEditor4与vue集成

最近公司ERP功能使用富文本编辑器CKEditor，在官网上看了一下发现CKEditor 5的功能不满足需要，所以选择了CKEditor 4 ，但是官网暂时没有提供CKEditor4与Vue的集成，这里记录下集成过程

1. CKEditor 4下载地址（full-.zip）
   https://ckeditor.com/ckeditor-4/download/
   解压后的文件放在Vue项目的static目录下

2. 在Vue的index.html中引入CKEditor4

   <script src="static/ckeditor/ckeditor.js"></script>
   

3. 新建Vue组件

   <template>
       <div>
           <textarea :id="id"></textarea>
       </div>
   </template>
   
   <script>
   export default {
     name: 'ckeditor4',
     props: [
       'value'
     ],
     mounted: function() {
    const self = this
   
       // 渲染编辑器
       self.ckeditor = window.CKEDITOR.replace(self.id)
   
       // 设置初始内容
       self.ckeditor.setData(self.value)
   
       // 监听内容变更事件
       self.ckeditor.on(