4.富文本编辑器图片的引入 (1)自带图片上传的缺点 富文本编辑器当然是可以上传图片的,但是上传的图片是以base64编码直接当作文本一起传到后台接口的,现在我们还没有修改接口,但是也可以测试一下。我还专门花了五分钟重做了一个11k大小的小logo进行测试: ...
//富文本图片大小import imageResizefrom'quill-image-resize-module'//调整大小组件。import { ImageDrop }from'quill-image-drop-module';//拖动加载图片组件。Quill.register('modules/imageResize', imageResize ); Quill.register('modules/imageDrop', ImageDrop); 6、在vue.config.js文件中引入 constwebpack...
[{ direction: 'rtl' }], // 文本方向---[{'direction': 'rtl'}] [{ size: ['small', false, 'large', 'huge'] }], // 字体大小---[{ size: ['small', false, 'large', 'huge'] }] [{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题---[{ header: [1, 2, 3, ...
普通的接口上传只需要不到1k,但是本次带图上传的大小达到了11k,也就是说图片的大小会影响接口上传速度,如果我们上传多张高达十几兆大小的图片,很可能对接口传值的负载过大,引起崩溃: 所以,我们要将图片的上传修改一下。 (2)修改图片上传方式 回到最初vue2-editor页面,找到自定义上传示例: 修改ArticleSet.vue: ...
<!-- 图片地址上传 --> <UploadImgUrl v-if="item.type === 'uploadImgUrl'" v-model="form[item.model]" /> <!-- 文件上传 【ps 目前后端接口只做了单个上传】 --> <UploadFile v-if="item.type === 'upload'" v-model="form[item.model]" ...