vue上传文件

<template>
    <div>

    <input type="file"  @change="change($event)"  >

    <button @click="sendPost">POST方式发送axios请求</button>

    </div>
</template>

<script>
import axios from 'axios'
export default {
    name:"userpict",
    data(){
        return{

        }
    },

    methods:{
        change(event) {
            this.file = event.target.files[0]
        },
        sendPost(){

            // 1、发送post请求
            var data = new FormData();
            data.append("fafafa",this.file)  // 图片对象
            data.append("username","zhangsan")  // 其他key-value值
            axios({
                url: 'http://127.0.0.1:8090/user/pict/',             //1、请求地址
                method: 'post',                                  //2、请求方法
                data: data,                                       //3、提交的数据
                // responseType: 'json',                           //4、返回默认格式json
                // headers: {'authorization': 'xxxtokenidxxxxx'},//5、身份验证token
            })
            // 2、回调函数
            .then(resp => {
                console.log(resp.data);
            })
            // 3、捕获异常
            .catch(err => {
                console.log('请求失败：'+err.status+','+err.statusText);
            });
        }

    }
}
</script>