最近遇到一個React上傳組件的問題,即上傳附件成功后,文件展示處仍然還有之前上傳附件的緩存信息,需要解決的問題是,要把上一次上傳的附件緩存在上傳成功或者取消后,可以進行清除
經過一頓試錯,終於解決了這個問題。
showUploadList,是可選參數,即是否展示uploadList,默認是開啟的,showUploadList:true即為展示,效果是當附件上傳成功后,會在頁面上顯示出上傳的附件名字記錄,如上圖所示。
需要解決的問題是:在有上傳按鈕的彈出框里,當上傳附件后,點擊確定或者彈出框取消時,之后再打開彈出框,原來的附件緩存還在彈出框上,這個問題的解決方法很簡單,只需要在Upload標簽外層加一個帶有隨機key的div即可解決:
Math.random()獲得的值是一個隨機數,這樣在每次打開彈窗的時候,Upload組件得到的key值就是唯一值了。
按照以上方法,即可以實現React+antd實現<Upload>組件上傳附件后再次上傳清除附件緩存的問題。