react-redux管理數據在使用ant.design使用Upload上傳圖片時,無法渲染圖片!

1、背景:

使用react-redux管理數據,在使用Upload上傳時,單獨開闢預覽區域,使用thumbUrl展示預覽圖片,在state更新後,dom有時可以更新,有時更新不了。

2、原因:

Upload組件在onChange事件中,file的thumbUrl屬性是異步添加的,在更新props時,這個值有時會不存在,導致dom無法渲染。

3、解決辦法:

異步再次dispatch一次

setTimeout(() => {
    const thumbUrl = value.fileList[0].thumbUrl;
    if (thumbUrl) {
        dispatch(RouterLayoutConfigAddStyleUploadActions(value))
    }
}, 1000)

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章