富文本复制粘贴图片上传至url

RuoYi

2025-04-24 7de94e2ea37803216e5afe9d40e7121c87a5344e

 src/components/ImageUpload/index.vue

@@ -6,6 +6,7 @@
      list-type="picture-card"

      :on-success="handleUploadSuccess"

      :before-upload="handleBeforeUpload"

      :data="data"

      :limit="limit"

      :on-error="handleUploadError"

      :on-exceed="handleExceed"

@@ -47,9 +48,19 @@


<script setup>

import { getToken } from "@/utils/auth";

import { isExternal } from "@/utils/validate";



const props = defineProps({

  modelValue: [String, Object, Array],

  // 上传接口地址

  action: {

    type: String,

    default: "/common/upload"

  },

  // 上传携带的参数

  data: {

    type: Object

  },

  // 图片数量限制

  limit: {

    type: Number,

@@ -79,7 +90,7 @@
const dialogImageUrl = ref("");

const dialogVisible = ref(false);

const baseUrl = import.meta.env.VITE_APP_BASE_API;

const uploadImgUrl = ref(import.meta.env.VITE_APP_BASE_API + "/common/upload"); // 上传的图片服务器地址

const uploadImgUrl = ref(import.meta.env.VITE_APP_BASE_API + props.action); // 上传的图片服务器地址

const headers = ref({ Authorization: "Bearer " + getToken() });

const fileList = ref([]);

const showTip = computed(

@@ -93,7 +104,7 @@
    // 然后将数组转为对象数组

    fileList.value = list.map(item => {

      if (typeof item === "string") {

        if (item.indexOf(baseUrl) === -1) {

        if (item.indexOf(baseUrl) === -1 && !isExternal(item)) {

          item = { name: baseUrl + item, url: baseUrl + item };

        } else {

          item = { name: item, url: item };

@@ -124,9 +135,11 @@
    isImg = file.type.indexOf("image") > -1;

  }

  if (!isImg) {

    proxy.$modal.msgError(

      `文件格式不正确, 请上传${props.fileType.join("/")}图片格式文件!`

    );

    proxy.$modal.msgError(`文件格式不正确，请上传${props.fileType.join("/")}图片格式文件!`);

    return false;

  }

  if (file.name.includes(',')) {

    proxy.$modal.msgError('文件名不正确，不能包含英文逗号!');

    return false;

  }

  if (props.fileSize) {