通過form表單與input來實現(xiàn)上傳功能蛉鹿,type=file實現(xiàn)上傳框滨砍,enctipart確認數(shù)據(jù)格式,method確實請求方式妖异,觸發(fā)函數(shù)new formData()實例惋戏,將需要傳的參數(shù)通過append方法加入formdata實例中,最后發(fā)送數(shù)據(jù)他膳。
????????????????<form?id="upload"?enctype="multipart/form-data"?method="post">
??????????????????<input?type="file"?name="file"?id="pic"?/>
??????????????????<input?type="button"?value="提交"?@click="uploadPic()"?/>
??????????????????<span?class="showUrl"></span>
??????????????????<img?src=""?class="showPic"?alt=""?/>
????????????????</form>
async?uploadPic()?{
??????var?form?=?document.getElementById("upload");
? ????var?formData?=?new?FormData(form);
??????formData.append("testPort",?this.adform.testPort);
??????formData.append("accessInterface",?this.adform.accessInterface);
??????formData.append("powerInterface",?this.adform.powerInterface);
??????formData.append("cpu",?this.adform.cpu);
??????formData.append("memory",?this.adform.memory);
??????formData.append("clockStatus",?this.adform.clockStatus);
??????formData.append("ipAddress",?this.adform.ipAddress);
??????formData.append("version",?this.adform.version);
??????formData.append("fileName",?this.adform.fileName);
??????console.log("formdata",?formData);
??????const?{?data:?res?}?=?await?this.$http.post(
????????"probeEquManagement/addProbe",
????????formData
??????);
??????console.log("上傳res",?res);
??????if?(res.code?!==?200)?{
????????this.$message.error(res.message);
??????}
??????if?(res.code?==?200)?{
????????this.$message.success(res.message);
????????this.alldle();
????????this.getlist();
??????}
????},