!205 富文本编辑器自定义上传地址

Merge pull request !205 from hechieh/N/A
This commit is contained in:
若依 2021-04-13 09:36:42 +08:00
commit f13b6d92d2
1 changed files with 40 additions and 0 deletions

View File

@ -1,5 +1,20 @@
<template>
<div>
<el-upload
:action="uploadUrl"
:on-success="handleUploadSuccess"
:before-upload="handleBeforeUpload"
:on-error="handleUploadError"
name="file"
:show-file-list="false"
:headers="headers"
style="display: none;"
ref='upload'
v-if='this.uploadUrl'
>
</el-upload>
<div class="editor" ref="editor" :style="styles"></div>
</div>
</template>
<script>
@ -30,6 +45,11 @@ export default {
readOnly: {
type: Boolean,
default: false,
},
/* 上传地址 */
uploadUrl: {
type: String,
default: '',
}
},
data() {
@ -95,6 +115,26 @@ export default {
init() {
const editor = this.$refs.editor;
this.Quill = new Quill(editor, this.options);
//
if (this.uploadUrl) {
let toolbar = this.Quill.getModule('toolbar');
toolbar.addHandler('image', (value) => {
this.uploadType = 'image';
if (value) {
this.$refs.upload.$children[0].$refs.input.click();
} else {
this.quill.format('image', false);
}
});
toolbar.addHandler('video', (value) => {
this.uploadType = 'video';
if (value) {
this.$refs.upload.$children[0].$refs.input.click();
} else {
this.quill.format('video', false);
}
});
}
this.Quill.pasteHTML(this.currentValue);
this.Quill.on("text-change", (delta, oldDelta, source) => {
const html = this.$refs.editor.children[0].innerHTML;