xmlrequest:
sendForm(str, types) { var form = this.$refs.ipas_form; var oOutput = document.querySelector("div"), oData = new FormData((document.forms.namedItem(str))); oData.append("username", "This is some extra data"); var oReq = new XMLHttpRequest(); //oReq.open("POST", "https://sddeznsm.com/file?type="+ types +"&app_name="+$("#app_name").val(), true); oReq.open("POST", "http://localhost:9000/file?type=" + types + "&app_name=" + form.text, true); oReq.onload = function (oEvent) { if (oReq.status == 200) { alert("上传成功"); // oOutput.innerHTML = "Uploaded!"; } else { alert("上传失败"); // oOutput.innerHTML = "Error " + oReq.status + " occurred when trying to upload your file.<br />"; } }; oReq.send(oData); }
组件(iview-admin):
<div style="display: block; 100%;text-align: center;"> <Upload action="http://localhost:9000/file?type=ipas&app_name=jinan" :on-format-error="handleFormatError" :max-size="204800" :before-upload="handleBeforeUpload" :on-progress="handleProgress" :on-success="handleSuccess" :on-error="handleError" > <span>请选择文件 </span> <Button type="ghost" icon="ios-cloud-upload-outline">上传文件</Button> </Upload> </div>
监听上传过程:
methods: { handleFormatError (file) { this.$Notice.warning({ title: '文件格式不正确', desc: '文件 ' + file.name + ' 格式不正确,请选择图片文件。' }); }, handleBeforeUpload (file) { this.$Notice.warning({ title: '文件准备上传', desc: '文件 ' + file.name + ' 准备上传。' }); }, handleProgress (event, file) { this.$Notice.info({ title: '文件正在上传', desc: '文件 ' + file.name + ' 正在上传。' }); }, handleSuccess (evnet, file) { this.$Notice.success({ title: '文件上传成功', desc: '文件 ' + file.name + ' 上传成功。' }); }, handleError (event, file) { this.$Notice.error({ title: '文件上传失败', desc: '文件 ' + file.name + ' 上传失败。' }); },