vue 使用input file点击上传本地图片

<input type="file" @change="upData($event)" ref="InputFile" name="files" />

 这里传本地图片给后台(java为例),流程是在点击完input file只后就会发送文件给后台提供的接口,会直接返回一个img路径,然后再传给对应的接口

upData(event) {
            var reader = new FileReader();
            let fileData = this.$refs.InputFile.files[0];
            reader.readAsDataURL(fileData);
            let _this = this;
            reader.onload = function(e) {
//这里的数据可以使本地图片显示到页面 _this.addimg
= e.srcElement.result; }; // 使用formapi打包 let formData = new FormData(); formData.append('file', fileData); this.axios.post('/api/v1/uploads/course/img', formData).then(function(res) { console.log(res); _this.addimgtijiao = res.data.path; }); }

 

posted @ 2019-02-16 12:52  ①丶①۵  阅读(953)  评论(0编辑  收藏  举报