Front-end upload files

<template>
    <el-upload action="" class="upload-demo" drag :http-request="uploadArticleCover">
        <!-- <el-image :src="articleCoverCallbackUrl" style="height: 180px"></el-image> -->
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
    </el-upload>
</template>

<script>
import axios from 'axios';
import {
    
     listFiles, getFiles, delFiles, addFiles, updateFiles, upload } from "@/api/file/files";
import request from '@/utils/request'

export function uploadImage(data) {
    
    
    return request({
    
    
        url: 'http://localhost:8088/file/files/upload',
        method: 'post',
        headers: {
    
     'Content-Type': 'multipart/form-data' },
        data: data
    })
}

export default {
    
    
    data() {
    
    
        return {
    
    
           
        };
    },
    methods: {
    
    
        // 自定义文件的上传
        uploadArticleCover(param) {
    
    
            console.log('进入了自定义上传')

            let formData = new FormData();
            formData.append('file', param.file)
            formData.append('pictureCategory', 'articleCover')
            uploadImage(formData).then(res => {
    
    
                console.log("上传完成")
                console.log(res.data)
                this.articleCoverCallbackUrl = res.data
            })
        }

    }
};
</script>