溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
Ant Design中使用Upload上傳組件該如何自定義文件列表展示位置，相信很多沒有經驗的人對此束手無策，為此本文總結了問題出現的原因和解決方法，通過這篇文章希望你能解決這個問題。
macOS Big Sur 11.1
React 16.12.0
Ant Design 4.10.0
現有一個需求，是上傳文件，點擊瀏覽文件按鈕，選中文件后，在按鈕的上方顯示，上傳的文件列表，如下圖所示
目前使用阿里的Ant UI組件庫，使用其中的上傳組件，官方提供的示例，如下圖如示
本地使用后，如下圖所示
如何才能實現，我們需要的效果呢，Google了好多文章，找到了一種方式，就是重寫itemRender方法，自定義文件列表的展示，使用這個方法，需要重寫多個action。
后來查看公司前端人員寫的代碼，看到另一種解決方法。
主要使用兩個Upload組件，第一個Upload組件主要是展示文件列表，第二個Upload組件是選擇文件上傳的這個操作，不過，選擇文件后，把文件列表在下方展示隱藏起來。
把得到的文件列表，賦值給第一個Upload組件中，大概如下：
部分代碼如下：
看完上述內容，你們掌握Ant Design中使用Upload上傳組件該如何自定義文件列表展示位置的方法了嗎？如果還想學到更多技能或想了解更多相關內容，歡迎關注億速云行業資訊頻道，感謝各位的閱讀！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
