Vue上传文件到springboot

            
                点击上传
                
只能上传jpg/png文件，且不超过500kb
            
            

            上传到服务器

在data中定义

        data: {
            fileLists: [],

使用on-change属性，将每次添加的文件依次推入到fileLists中，然后将fileLists的文件使用formData封装，请求头为'multipart/form-data'

            handleChange(file) {
                this.fileLists.push(file)
            },
            submitUpload() {
                const formData = new FormData()
                // 因为要传一个文件数组过去，所以要循环append
                this.fileLists.forEach((file) => {
                    formData.append('files', file.raw)
                })
                this.uploadRequest(formData)
            },
            uploadRequest(formData) {
                let that = this;
                axios.post("http://localhost:8080/new/upload", formData, {
                    headers: {
                        'Content-Type': 'multipart/form-data'
                    }
                })
                    .then(function (res) {
                        console.log(res)
                        if (res.data.result == "ok") {
                            that.$message.success('上传成功!');
                        }
                    })
                    .catch(function (err) {
                        that.$message.error('网络请求异常!');
                    })
            },

后端代码：

    @PostMapping("/new/upload")
    public baseResultModel uploadPic(@RequestParam("files") MultipartFile[] files) {
	// 逻辑
}