vue-quill-editor支持图片缩放和粘贴图片过来的时候自动过滤

import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";import imageResize from 'quill-image-resize-module'; // 图片缩放组件引用import quillEditor, {Quill
} from "vue-quill-editor";
Quill.register('modules/imageResize ', imageResize); // 注册
Vue.use(quillEditor);<quill-editor ref="myTextEditor" class="ztyjDialog-ql-editor" v-model="form.content" :options="editorOption"></quill-editor>this.editorOption = {modules: {toolbar: [['image'], // 链接、图片、视频],clipboard: {matchers: [[Node.ELEMENT_NODE, this.handleCustomMatcher]],},imageResize: {//放大缩小displayStyles: {backgroundColor: 'black',border: 'none',color: 'white',},modules: ['Resize', 'DisplaySize'],},},placeholder: '请输入正文',
};handleCustomMatcher(node, Delta) {let ops = [];Delta.ops.forEach(op => {if (op.insert && typeof op.insert === 'string') {ops.push({insert: op.insert,attributes: op.attributes, //文字样式（包括背景色和文字颜色等)});} else {if(op.insert&&op.insert.image&&op.insert.image.includes(';base64,')){ops.push(op)}// this.$message.warning("消息內容不支持圖片！");}});Delta.ops = ops;return Delta;
},

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！