<template>
    <div class="feedback-container" v-if="showFlag">
        <el-button @click="showFeedback"></el-button>
        <el-dialog title="" width="650px"
                   :visible.sync="dialogFeedback"
                   :lock-scroll="false"
                   @close="closeHandle"
                   :close-on-click-modal="false">
            <el-form   :model="feedbackForm"  ref="feedbackForm" label-width="100px">
                <el-form-item label=":"
                             
                >
                    <el-input type="textarea" resize="none" v-model="feedbackForm.feedbackContent"
                              placeholder="140"></el-input>
                </el-form-item>
                <el-form-item label="1:">
                        <el-upload
                                action="/api/fs/validate"
                                class="upload-demo"
                                :limit="1"
                                :data="{ key : "files"}"
                                :file-list="fileList.files"
                                :http-request="upload"
                        >
                            <el-button size="small" type="primary"></el-button>
                        </el-upload>
                        <div class="el-form-item__error" v-if="uploadError">
                            {{ uploadError }}
                        </div>
                </el-form-item>
                <el-form-item label="2:">
                    <el-upload
                            action="/api/fs/validate"
                            :data="{ key : "dd"}"
                            :limit="1"
                            class="upload-demo"
                            :file-list="fileList.dd"
                            :http-request="upload"
                    >
                        <el-button size="small" type="primary"></el-button>
                    </el-upload>
                    <div class="el-form-item__error" v-if="uploadError">
                        {{ uploadError }}
                    </div>
                </el-form-item>
                <el-form-item label=":"
                              prop="contact"
                >
                    <el-input v-model="feedbackForm.contact" placeholder="//QQ"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitForm("feedbackForm")"> </el-button>
                <el-button @click="dialogFeedback = false"> </el-button>
            </div>
        </el-dialog>
    </div>

</template>
<script>
  

    export default {
        data() {
          
            return {
                fileList: {
                    files: [],
                    dd: []
                },
                dialogFeedback: false,
                showFlag: true,
                feedbackForm: {
                    userId: "",
                    feedbackContent: "",
                    attachmentId: "",
                    contact: ""
                },
           
                loading: false,
                uploadError: "",
          
            }
        },
       
        created() {
           
        },
        methods: {
           
            showFeedback() {
                this.dialogFeedback = true;
            },
            upload (item) {
                let key = item.data.key;
                console.log(key);
                this.loading = true;
                this.uploadError = "";
                var myfile = item.file;
                // 
                this.sysFileUpload(myfile);
                // 
                this.onUploadFinish = (params) => {

                    this.feedbackForm.attachmentId = params.fileId;
                  //  this.fileList[key][0] = { "name": myfile.name,"url": params.fileId };
                 this.fileList[key].push({ "name": myfile.name,"url": params.fileId });
                    this.loading = false;
                };
                // 
                this.onError = (params) => {
                    console.log("onError");
                    console.log(params.errorMessage);
                    this.loading = false;
                    this.uploadError = params.errorMessage;
                }
            },
           
            closeHandle() {
                this.uploadError = "";
                this.feedbackForm.attachmentId = "";
                this.utils.resetForm(this.fileList,[]);
                this.loading = false;
                this.$refs.feedbackForm.resetFields();
            }
        }
    }
</script>

in the example above, using the element upload component, in the custom upload method, if you write this.fileList [key] .push ({"name": myfile.name, "url": params.fileId}); , after uploading both file 1 and file 2 successfully, click cancel. When you click upload again, after uploading file 1, the file list of file 2 also shows the value of file 1, that is, all have values in fileList, and the values in fileList.dd are the same as those in fielList.files.

but write this.fileList [key] [0] = {"name": myfile.name, "url": params.fileId}; , so there will be no mistakes. It has bothered me for a long time to find a solution.

Note: clear fileList when you click cancel