在jeecg中使用a-upload(ant-design-vue组件)出现http:localhost:3000/sys/common/upload错误,页面上传不到指定路径

时间:2024-04-12 14:14:48
修改如下:
<template>
    <div>
      <a-upload
        name="file"
        :multiple="true"
        :action="url.fileUpload"
        :headers="headers"
        @change="handleChange"
      >
        <a-button> <a-icon type="upload" /> 点击上传 </a-button>
      </a-upload>

      <div class="clearfix">
        <a-upload
          :action="url.fileUpload"
          listType="picture-card"
          :fileList="fileList"
          :headers="headers"
          @preview="handlePreview2"
          @change="handleChange2"
        >
          <div v-if="fileList.length < 3">
            <a-icon type="plus" />
            <div class="ant-upload-text">Upload</div>
          </div>
        </a-upload>
        <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
          <img alt="example" style="width: 100%" :src="previewImage" />
        </a-modal>
      </div>
    </div>
</template>

<script>
  import { httpAction } from '@/api/manage'
  import Vue from 'vue'
  import { ACCESS_TOKEN } from '@/store/mutation-types'

  export default {
    data() {
      return {
        headers: {
          authorization: 'authorization-text'
        },
        url: {
          fileUpload: window._CONFIG['domianURL']+"/sys/common/upload"
        },
        previewVisible: false,
        previewImage: '',
        fileList: [
          {
            uid: '-1',
            name: 'xxx.png',
            status: 'done',
            url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
          },
        ],
      };
    },
    created (){
      const token = Vue.ls.get(ACCESS_TOKEN);
      this.headers = {"X-Access-Token":token}
    },
    methods: {
      handleChange(info) { // 上传文件
        if (info.file.status !== 'uploading') {
          console.log(info.file, info.fileList);
        }
        if (info.file.status === 'done') {
          this.$message.success(`${info.file.name} 上传成功`);
        } else if (info.file.status === 'error') {
          this.$message.error(`${info.file.name} 上传失败.`);
        }
      },
      handleCancel(){
        this.previewVisible = false
      },
      handlePreview2(file){
        this.previewImage = file.url || file.thumbUrl
        this.previewVisible = true
      },
      handleChange2({ fileList }){
        this.fileList = fileList
      }
    },
  };
</script>

<style scoped>

</style>

在jeecg中使用a-upload(ant-design-vue组件)出现http:localhost:3000/sys/common/upload错误,页面上传不到指定路径