mirror of
				https://github.com/dromara/RuoYi-Vue-Plus.git
				synced 2025-11-04 16:23:42 +08:00 
			
		
		
		
	富文本编辑组件添加类型属性
This commit is contained in:
		@@ -9,7 +9,7 @@
 | 
				
			|||||||
      :headers="headers"
 | 
					      :headers="headers"
 | 
				
			||||||
      style="display: none"
 | 
					      style="display: none"
 | 
				
			||||||
      ref="upload"
 | 
					      ref="upload"
 | 
				
			||||||
      v-if="this.uploadUrl"
 | 
					      v-if="this.type == 'url'"
 | 
				
			||||||
    >
 | 
					    >
 | 
				
			||||||
    </el-upload>
 | 
					    </el-upload>
 | 
				
			||||||
    <div class="editor" ref="editor" :style="styles"></div>
 | 
					    <div class="editor" ref="editor" :style="styles"></div>
 | 
				
			||||||
@@ -46,14 +46,15 @@ export default {
 | 
				
			|||||||
      type: Boolean,
 | 
					      type: Boolean,
 | 
				
			||||||
      default: false,
 | 
					      default: false,
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    /* 上传地址 */
 | 
					    /* 类型(base64格式、url格式) */
 | 
				
			||||||
    uploadUrl: {
 | 
					    type: {
 | 
				
			||||||
      type: String,
 | 
					      type: String,
 | 
				
			||||||
      default: "",
 | 
					      default: "",
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
  data() {
 | 
					  data() {
 | 
				
			||||||
    return {
 | 
					    return {
 | 
				
			||||||
 | 
					      uploadUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
 | 
				
			||||||
      headers: {
 | 
					      headers: {
 | 
				
			||||||
        Authorization: "Bearer " + getToken()
 | 
					        Authorization: "Bearer " + getToken()
 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
@@ -119,7 +120,7 @@ export default {
 | 
				
			|||||||
      const editor = this.$refs.editor;
 | 
					      const editor = this.$refs.editor;
 | 
				
			||||||
      this.Quill = new Quill(editor, this.options);
 | 
					      this.Quill = new Quill(editor, this.options);
 | 
				
			||||||
      // 如果设置了上传地址则自定义图片上传事件
 | 
					      // 如果设置了上传地址则自定义图片上传事件
 | 
				
			||||||
      if (this.uploadUrl) {
 | 
					      if (this.type == 'url') {
 | 
				
			||||||
        let toolbar = this.Quill.getModule("toolbar");
 | 
					        let toolbar = this.Quill.getModule("toolbar");
 | 
				
			||||||
        toolbar.addHandler("image", (value) => {
 | 
					        toolbar.addHandler("image", (value) => {
 | 
				
			||||||
          this.uploadType = "image";
 | 
					          this.uploadType = "image";
 | 
				
			||||||
@@ -165,7 +166,7 @@ export default {
 | 
				
			|||||||
        // 获取光标所在位置
 | 
					        // 获取光标所在位置
 | 
				
			||||||
        let length = quill.getSelection().index;
 | 
					        let length = quill.getSelection().index;
 | 
				
			||||||
        // 插入图片  res.url为服务器返回的图片地址
 | 
					        // 插入图片  res.url为服务器返回的图片地址
 | 
				
			||||||
        quill.insertEmbed(length, "image", res.url);
 | 
					        quill.insertEmbed(length, "image", process.env.VUE_APP_BASE_API + res.fileName);
 | 
				
			||||||
        // 调整光标到最后
 | 
					        // 调整光标到最后
 | 
				
			||||||
        quill.setSelection(length + 1);
 | 
					        quill.setSelection(length + 1);
 | 
				
			||||||
      } else {
 | 
					      } else {
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user