Vue.js - Element UI - Utiliser le composant de téléchargement sans déclenchement de la requête POST

Question

J'utilise le composant de téléchargement de l'interface utilisateur d'élément. Il déclenche malheureusement une requête POST dès qu'un fichier est téléchargé. Ce que je vise est de pousser les fichiers vers un tableau vide qui serait posté après avec le bouton.

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

Apparemment, vous devez également mettre l'hélice auto-upload être false. Sinon, il est par défaut true et essaiera automatiquement de télécharger le fichier même si vous avez spécifié une fonction pour le prop http-request.

Dans votre cas:

<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.