sourcecode

Vue.js - 요소 UI - POST 요청을 트리거하지 않고 업로드 구성 요소 사용

copyscript 2022. 8. 15. 21:31
반응형

Vue.js - 요소 UI - POST 요청을 트리거하지 않고 업로드 구성 요소 사용

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

듣자하니, 당신은 또 다른 세팅도 해야 합니다.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>

여기 컴포넌트에 대한 설명서가 있습니다.

언급URL : https://stackoverflow.com/questions/46594146/vue-js-element-ui-use-upload-component-without-post-request-triggering

반응형