之前需求方提出説想要給表單上傳的文件增加預覽功能,原來點擊展示列表中的文件時,docx文件會啓動下載,而pdf會啓動新的tab頁進入預覽,所以最好是統一處理。
因為我對Upload組件用的不多,對它不夠了解,所以一開始我想着從fileList下手,不用Upload默認的展示列表,經過多番嘗試發現有點麻煩,於是打開官網文檔研究,才發現原來文檔裏已經提供了相關的功能,原來點擊文件的展示列表默認的動作是文檔裏的onPreview回調,要區分預覽和下載的入口,可以增加showDownloadIcon的配置,並增加onDownload的回調用於處理文件的下載,那麼預覽和下載的處理就可以區分開來。
但是問題到這裏並沒有完全解決,當我重新進入表單頁面進入編輯時,也就是表單內容回顯時,發現沒有出現下載按鈕,查了很久的文檔都沒有找到怎麼解決,也在網上搜索了一下,不知道是不是我搜索的關鍵詞不對,就是沒找到答案,就只能自己翻項目裏的依賴包,各種嘗試,才發現原來文件列表中的文件需要同時設置status為'done',下載的按鈕才會顯示。
所以表單內容回顯的時候,需要單獨給上傳的文件列表進行處理,因為我這邊接口沒有存status的值,又因為文件上傳成功後,才會被表單整體提交保存,文件的狀態可以默認為done,所以在加載表單內容時,直接給文件列表處理成如下結構就可以。
[
{ url, name, status: 'done' }
]