Vue.js Element-UI和axios文件上传导致页面刷新

Question

我正在使用element-ui文件上传组件（ https://element.eleme.io/#/en-US/component/upload ）处理图像上传的前端。 一切正常（文件发送到服务器等）。 但是，在执行axios的成功响应代码后，由于某些奇怪的原因，页面会自动刷新。 我尝试发送不带文件的相同帖子请求，并且页面不会自动刷新。

提交按钮类型设置为“按钮”，因此在这种情况下这不是问题。

axios发布请求的代码：

base.post('/add/visit/', formData,   {headers: {'Authorization' : 'Bearer ' + localStorage.getItem('token') ,'Content-Type': 'multipart/form-data'}})

    .then(response => {
      console.log(response);
      resolve(response)
    })
    .catch(err => {
      console.log(err)
      reject(err)
    })
})

Answer 1

我想知道它是否具有默认行为，例如发生表单提交。 如果没有href属性，它将重新加载页面。 有没有可以像onClick（e）一样参与的活动？ 然后在处理它的函数中执行e.preventDefault（）;。

https://www.w3schools.com/jsref/event_preventdefault.asp

Answer 2

Element-ui上载可以为您上载文件，然后没有页面刷新：

el-upload(:action="formUploadLocation" :data="form" :auto-upload="false" ref="upload" :file-list="list"
          :on-success="handleSucces" :on-error="handleFail"

然后以表单提交形式上传（仅在：auto-upload = false时）：

this.$refs.upload.submit()