數據格式

[1xxxx,2xxxx,3xxxx,4xxxx,5xxxx,6xxxx,7xxxx,8,xxxx,9xxxx]

運行效果

?

代碼部分

<divgutter={24}style={{width: '100%',display: 'flex',justifyContent: 'space-between',flexWrap: 'wrap ',}}>{item.imgList &&item.imgList.map((itemList, index) => (<divstyle={{ width: '30%' }}span={8}onClick={() => this.handleClick(itemList)}><imgstyle={{ display: 'block' }}src={itemList}key={index}style={{ width: '100%' }}/></div>))}</div>

總結

以上是生活随笔為你收集整理的React实现图片自适应的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。