Vue上传文件，不必使用什么element 的uplaod, 也不用什么npm上找的个人写的包，就用原生的Vue加axios就行了， 废话不多说，直接上代码：
html:
<input type="file" value="" id="file" @change="uploadConfig">
注意这里的type是file，就表示是上传文件了
js:
uploadConfig(e) {
let formData = new FormData();
let data = JSON.stringify({
user: "username",
env: "dev"
})
formData.append('file', e.target.files[0]);
formData.append('data', data); // 上传文件的同时， 也可以上传其他数据
let url = this.$store.state.path + "api/tools/handle_upload_file";
let config = {
headers:{'Content-Type':'multipart/form-data'}
};
this.$axios.post(url,formData, config).then(function (response) {
console.log(response.data)
})
}
1. vue里面的axios，如果要用这种方式写，注意请求方式是method, 而不是 type:
this.$axios({
url:this.$store.state.path + "api/tools/handle_upload_file",
method: "POST", // 这个地方注意
data: formData,
file:e.target.files[0],
processData:false,
contentType:false,
success:(response) => {
console.log("upload_success_response:", response)
}
})
2. 传输文件类型，必须加上请求头： headers:{'Content-Type':'multipart/form-data'}
3. 注意axios的用法
后端（python)：
def handle_upload_file(request):
if request.method == "POST": file = request.FILES.get("file") # 获取文件要用request.FILES
data = request.POST.get("data") # 从POST请求中获取其他数据， 提前在formData中定义的
print file for chunk in file.chunks(): # 分块读取二进制文件的方法
print chunk return HttpResponse(json.dumps({"meta": 200, "msg": "ok"}))
关于下载文件， 本质就是创建一个a标签，把文件放在a标签中， 也可以直接把下载按钮写成a标签， 直接跳转到服务器的下载接口， 不过这样会跳转页面
看一个demo
download(){
let self = this;
let url = self.$store.state.path + "tools/download_file";
let data = JSON.stringify({
user: self.$store.state.username,
file_name: self.plist_file_name
});
console.log("data:", data)
self.$axios(
{
method: "post",
url: url,
data: data,
responseType: "blob", // 指定获取数据的类型为blob
}
).then(
function (response) {
data = response.data;
// 创建a标签并点击， 即触发下载
let url = window.URL.createObjectURL(new Blob([data]));
let link = document.createElement("a");
link.style.display = "none";
link.href = url;
link.setAttribute("download", self.plist_file_name); document.body.appendChild(link);
link.click()
}
).catch(function (err) {
console.log(err)
}) }
python端代码（Django）:
def download_file(request):
if request.method == "POST":
data = json.loads(request.body)
response = {}
file_name = data.get("file_name")
if not file_name:
response["meta"] = {"code": 400}
response["error"] = {"error_msg": "parameter error, no file_path"}
return HttpResponse(json.dumps(response))
file_path = "/tmp/file/" + file_name
file = open(file_path, "rb")
response = HttpResponse(file)
response["Content-Type"] = "application/octet-stream"
response["Content-Disposition"] = "attachment;filename={}".format(file_name)
return response