ckeditor5官网目前不支持wps的图片粘贴，但可以通过修改源码实现。

const ZZ_HTTP = process.env.NODE_ENV === 'development' ? /^http:\/\/192.168.1.205/ : /^http:\/\/线上地址/

let IS_UPLOAD = false

export default {

name: 'my-quill-edit',

data () {

return {

editor: null,//编辑器实例

};

},

model: {

prop: 'modelData',

event: 'modelChage'

},

props: {

modelData: {

type: String,

default: ''

},

disabled: {

type: Boolean,

default: false

}

},

created () {

this.value2 = this.modelData

setTimeout(() => {

this.$nextTick(() => {

this.initCKEditor()

})

}, 500);

},

mounted () {

},

methods: {

initCKEditor () {

if (this.disabled) return

let _this = this;

class UploadAdapter {

constructor(loader) {

this.loader = loader;

}

async upload () {

//重置上传路径

// let fileName = 'goods' + this.loader.file.lastModified;

//  var fileName = 'goods' + this.loader.file.lastModified

// 通过 FormData 对象上传文件

let file = await this.loader.file

return new Promise((resolve, reject) => {

let formData = new FormData();

formData.append('files', file);

_this.$api.ckeditImageUpload3(formData).then(res => {

// let resData = res[0]

// resData.default = res[0].filePath;

if (res) {

resolve({

default: res[0].filePath

});

} else {

resolve({

default: ''

});

}

}).catch(error => {

reject(error)

return false

})

})

// _this.$axios.post(_this.$url.uploadUrl, formData).then(rs => {

//  if (rs) {

//    console.log(rs.filePath);

//  }

// });

// client().put(fileName, this.loader.file).then(result => {

//  console.log(result);

//  resolve({

//    default: result.url

//  })

// }).catch(err => {

//  console.log(err)

// })

}

abort () {

}

}

ClassicEditor.create(document.querySelector('#editor'), {

ckfinder: {

// uploadUrl: this.$url.uploadUrl

//后端处理上传逻辑返回json数据,包括uploaded(选项true/false)和url两个字段

}

}).then(editor => {

const toolbarContainer = document.querySelector('#toolbar-container');

toolbarContainer.appendChild(editor.ui.view.toolbar.element);

// 加载适配器

editor.plugins.get('FileRepository').createUploadAdapter = (loader) => {

return new UploadAdapter(loader);

}

this.editor = editor //将编辑器保存起来，用来随时获取编辑器中的内容等，执行一些操作

editor.setData(this.modelData || '')

editor.model.document.on('change:data', (eventInfo, name, value, oldValue) => {

// this.value = this.editor.getData()

this.handleImage(this.editor.getData())

this.$emit('modelChage', this.editor.getData())

});

}).catch(error => {

console.error(error);

});

},

handleImage (val) {

var imgReg = /|\/>)/gi

var srcReg = /src=[\'\"]?([^\'\"]*)[\'\"]?/i

var arr = val.match(imgReg)

let array = []

if (arr) {

for (var i = 0; i < arr.length; i++) {

var src = arr[i].match(srcReg)

// 获取图片地址

if (!src) return false

if (src && src[1] && !src[1].match(ZZ_HTTP)) {

array.push(src[1])

}

}

}

if (array[0]) {

this.uploadImage(array)

}

},

uploadImage (array) {

this.$api.ckeditImageUpload({ urlList: array }).then(res => {

if (res) {

let newVal = this.editor.getData()

let str = ''

res.forEach(item => {

newVal = newVal.replace(item.oldUrl, item.newUrl)

})

// this.editor.destroy(true);//销毁编辑器

this.editor.setData(newVal)

}

})

}

}

}

.ck.ck-editor__editable_inline {

max-height: 500px !important;

overflow-x: hidden !important;

}

#editor .ck-blurred.ck {

height: 400px;

}

.look {

max-height: 500px;

overflow-x: hidden;

}