最近用Spring Boot和Vue Element實現了一個微型項目,該項目自構思到第一個版本的實現用了1個月的時間。
時間從下班吃過晚飯,加班到11點做的;但是從功能實現到細節優化用了3個月的時間。
“做”是一回事,“做好”是另外一回事。當然花了3倍的工作量,也不見得就做的很到位。
閑話少敘,言歸正傳。本文介紹我用SpringBoot和Vue實現的文件上傳功能。
1. 實話說,做一個文件上傳並不難。方法無外乎利用自己以前寫的代碼,或者用搜索引擎參考別人的代碼。
本文中寫的方法,參考了網上的例子,參考了幾篇博文(實在不好意思,當時的鏈接未保存),在此表示感謝,就不一一列舉。
先上效果圖:
點擊“導入數據”,會彈出一個對話框,選擇Excel文件:
點擊“導出數據”,會從后台查詢數據后生成一個Excel文件。
2. 前端Vue Element部分,導入通過el-upload實現,導出通過el-button實現。其中beforUpload和exportData代碼如下:
3. 后端Spring boot部分,上傳普通txt等文件的Controller中的方法
上傳Excel文件的Controller中的方法:
業務邏輯部分對應的代碼:
導出Excel對應Controller中的方法:
其中POIUtils是用來從Mysql數據庫中查詢數據,然后生成一個Excel文件並寫到輸出流中。
生成Excel用的是Apache的POI,然后參考網上實現的代碼自己封裝了一個Util類,其核心代碼如下: