Home > Web Front-end > JS Tutorial > axios sends a post request and submits image type form data method

axios sends a post request and submits image type form data method

亚连
Release: 2018-05-29 17:26:34
Original
1706 people have browsed it

Below I will share with you an article about axios sending post request and submitting image type form data method. It has a good reference value and I hope it will be helpful to everyone.

DOME

<input type="file" @change="upload" ref="upload">
Copy after login

Interface

const userUploadAtt = (File,config) => axios.post("接口",File,config)
Copy after login

Processing data

let input = this.$refs.upload 
创建一个空的FormData对象 
let data = new FormData();
使用FormData.append来添加键/值对到表单里面;
data.append(&#39;file&#39;, input.files[0]);
upload(){
 userUploadAtt(data,{headers: {&#39;Content-Type&#39;: &#39;multipart/form-data&#39;}}).then((response)=>{
  this.headPhoto = response.data[0].msg.url;
 }).catch(()=>{
 })
}
Copy after login

Note:

If

axios.defaults.headers.post[&#39;Content-Type&#39;] = &#39;application/x-www-form-urlencoded;charset=UTF-8&#39;
post请求时候表单上传不需要引入qs.stringify()
Copy after login

The above is what I compiled for everyone , I hope it will be helpful to everyone in the future.

Related articles:

About the difference between v-if and v-show in vuejs and the problem that v-show does not work

Using iview to customize the verification keyword input box in vue Problems and solutions

The problem of adding expressions to v-show in Vue (determining whether to display)

The above is the detailed content of axios sends a post request and submits image type form data method. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template