标签:app one dac event type content 直接 || move
最近做项目的附件上传,前端vue用到element的上传,记录下以备不时之需
单个文件上传的HTML。
下面为js脚本
1 export default { 2 name: "schemeList", 3 data() { 4 return { 5 loading: false, 6 attachList:[], 7 attachmentList: [], 8 viwMode: "add", 9 tableHeight: 160, 10 uploadUrl: "/upload", 11 form: { 12 file: "" 13 }, 14 fileList: [], 15 importHeaders: { 16 enctype: "multipart/form-data" 17 }, 18 }; 19 }, 20 watch: {}, 21 computed: {}, 22 created: function() {}, 23 mounted: function() { 24 }, 25 methods: { 26 fileChange(file) { 27 this.form.file = file.raw; 28 this.fileList.push(file.raw); //上传文件变化时将文件对象push进files数组 29 //alert(file.raw); 30 }, 31 handleProgress(event, file, fileList) { 32 alert("in progress"); 33 }, 34 submitUpload() { 35 let that = this; 36 debugger; 37 if(that.form.file==null || that.fileList.length == 0){ 38 that.$message.info("请选择要上传的文件!"); 39 return; 40 } 41 42 that.loading=true; 43 let formData = new FormData(); 44 formData.append("file", that.form.file); //单个文件 45 that.$axios 46 .post(that.uploadUrl, formData, { 47 "Content-Type": "multipart/form-data" 48 }) 49 .then(res => { 50 that.$refs.upload.clearFiles(); 51 that.fileList = []; 52 that.$message.success(res.data); 53 console.log(res); 54 }) 55 .catch(err => { 56 that.$message.error(err.data); 57 console.log(err); 58 }); 59 }, 60 handleRemove(file, fileList) { 61 this.$refs.upload.clearFiles(); 62 this.fileList = []; 63 console.log(file, fileList); 64 }, 65 handlePreview(file) { 66 alert(file); 67 console.log(file); 68 } 69 } 70 };
yml文件配置
标签:app one dac event type content 直接 || move
原文地址:https://www.cnblogs.com/free-javax/p/12873987.html