Vue.js - 元素UI - 使用上传组件，无需POST请求触发

Question

我正在使用Element UI的上传组件。不幸的是，一旦上传文件就会触发POST请求。我想要的是将文件推送到一个空的数组，然后用按钮发布。

HTML

// Element UI documentation says http-request overrides xhr behavior 
// so I can use my own file request. In this case, I wanted to use a method 
// though I'm not quite sure about this part? 
<el-upload 
    action="", 
    :http-request="addAttachment", 
    :on-remove="deleteAttachment", 
    :file-list="attachments"> 
    <el-button size="mini" type="primary">Add file</el-button> 
</el-upload> 

// button that uploads the files here 

JS

data() { 
    attachments: [] 
}, 

methods: { 
    addAttachment (file, fileList) { 
      this.attachments.push(file); 
    }, 

    deleteAttachment() { 
      // removes from array 
    } 
} 

Answer 1

显然，你还需要设置auto-upload道具是false。否则，默认为true，即使您为http-request支柱指定了一个功能，它也会自动尝试上传文件。

你的情况：

<el-upload 
    action="", 
    :http-request="addAttachment", 
    :auto-upload="false" 
    :on-remove="deleteAttachment", 
    :file-list="attachments" 
> 
    <el-button size="mini" type="primary">Add file</el-button> 
</el-upload> 

Here's the documentation for the component.