Vue文件上传方法

最新推荐文章于 2024-08-22 15:15:49 发布

小风很努力

最新推荐文章于 2024-08-22 15:15:49 发布

阅读量614

点赞数 1

文章标签： vue.js javascript 前端 vue

本文链接：https://blog.csdn.net/qq_54257938/article/details/121990149

版权

前端新人,欢迎各位大佬指出问题

通过FormData()方法来上传到后端,使用的是BootStrapVue文件选择组件

uploadFile(){
    if (this.file==null) {
      alert('您尚未选择文件')
    }else{
      var formData = {};
      formData = new FormData();
      //file为后端接收的数据名,需要和后端进行沟通
      formData.append('file', this.file);
      axios
    .post('接口',formData
    ,{
      headers: {
              "Content-Type": "application/json;charset=UTF-8",
            },
    })
    .then((response)=>{
      console.log(response)
      alert('上传成功')
      //上传成功后让文件选择框为空
      this.file =null,
      //刷新
      this.reload()
    })
    .catch((error)=>{
      console.log(error)
      alert('上传失败')
    })
    }
  },