vue使用axios上传图片

参考：https://www.cnblogs.com/rachelch/p/8462877.html

html部分，可以把input file的opacity设置为0，点击其父容器，即触发file

axios的post请求，发送form数据部分，这样就可以无刷新的提交form数据到后台

　　　　　　　update(e){
                let file = e.target.files[0];           
                let param = new FormData(); //创建form对象
                param.append('tweetPic',file,file.name);//通过append向form对象添加数据     
                //param.append('chunk','0');//添加form表单中其他数据
                //console.log(param.get('tweetPic')); //FormData私有类对象，访问不到，可以通过get判断值是否传进去
                let config = {
                    headers:{'Content-Type':'multipart/form-data'}
                };  //添加请求头
                   axios.post('url/',param,config)
                .then(response=>{
                    console.log(response.data);
                })        
            }                

 

【扩展】

使用form表单上传图片

  
  
  
  
  

 

  

    
    
    
    提交