關於web端圖片上傳的問題，一般均採用input type=file來上傳，添加相關multiple屬性，可以一次性上傳多張。實際使用中，要求不高的話，這樣也可以滿足簡單的需求。但存在兩個問題：一，無本地預覽。二，每次選擇，會覆蓋前次選擇的，不可追加選擇。公司項目需求，有大量的圖片管理，最起碼的是就是添加和刪除，顯然，這樣是無法滿足需求的。
於是探索起原理。
首先每次點擊圖片瀏覽按鈕，會觸發onChange事件，我們可以以此找解決思路。然後就是我們發現，我們選擇的文件，存在filelist對象裏面。按道理，我們只需動態追加（append） file到 filelist即可，但經過一天的探索，發現存在類型轉化問題，怎麼都成功不了。然後網上找資料，網上很多例子，把本地圖片的預覽，添加和刪除，做的很好，利用blob類型，和對dom的動態操作，具體自行搜索。但涉及到文件upload這一問題時，都沒有解決。甚至有人說動態添加input type=file。但個人覺得，這不是合理的，徹底的解決思路。
最後，經過一天的研究，換了一種思路，基本徹底解決了本地多文件追加添加，預覽，刪除，上傳問題。基本思路利用formData。寫的demo，前端地址如下，後端很簡單。
鏈接: https://pan.baidu.com/s/1BV9yuu_Kb1ab7TIsN8KNXQ 提取碼: va9v 複製這段內容後打開百度網盤手機App。如有問題可留言。
寫此文章，附源碼，效果圖如下，以供備忘。