vue上传文件

                       现在发现传文件其实没有多么困难,比起之前用nodejs写,vue真的方便不少,不仅仅是写代码方便,而且还有element ui组件库,这让写项目来说简单了很多

                        下面这个是就是上传文件的代码:

   <div class="main-box-right-part">
    <p>头像</p>
    <img src="../../assets/ly/img/1.jpg" class="head-img" width="60px" height="60px" >
   <input type="file" ref="file" v-show="false" name="file" accept="image/*" @change="modifyHeadimg">
    <button @click="$refs.file.click()">修改</button>
  </div>

 modifyHeadimg(e){        
        let file = e.target.files[0];  //这个是获取文件
        const formdata = new FormData();//new一个formdata对象
        formdata.append("file", file);//把文件加到formdata上面(其中名字要与接口的名字对应)
         this.$http({
                url:'/shops/user/update/updateUserAvatar',
                method:'PUT',
                data:formdata,//简单的传值
                params:{
                  userId:8
                },
                maxContentLength:Infinity,
                maxRedirects:5,
                maxBodyLength:Infinity,
                headers: { 'Authorization': cookie.getToken() }
            }).then(data => {
              const list = data.data.message
              if(list === '成功'){
                  this.$message({
                        type: "success",
                        message: "修改头像成功!"
                    })
                    console.log(data);
              }
            }).catch(err => {
                console.log(err);
            })
}

之前写代码就是一直测试一直报错,就很烦躁,这样就觉得很轻松,而且很清楚便于查看!