Vue3使用vue-quill富文本编辑器实现图片大小调整

最新推荐文章于 2024-09-29 17:29:37 发布

T3165919332

最新推荐文章于 2024-09-29 17:29:37 发布

阅读量379

点赞数 1

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/T3165919332/article/details/142526535

版权

安装uill-image-resize

npm install quill-image-resize --save

在项目中导入并注册插件

import { QuillEditor, Quill } from '@vueup/vue-quill';
import ImageUploader from 'quill-image-uploader';
import ImageResize from 'quill-image-resize'; //导入插件
import '@vueup/vue-quill/dist/vue-quill.snow.css';

// 注册插件
Quill.register('modules/imageResize', ImageResize);

export default {
  components: {
    QuillEditor,
  },
  data() {
    return {
      editorOption: {
        modules: {
          imageResize: {}, // 图像缩放
          toolbar: [/* 工具栏配置 */],
        },
      },
    };
  },
};