福州正规网站建设公司报价,有没有做任务给钱的网站,合肥最好的网站建设,许昌专业做企业网站的最近在开发一个批量展示图片的页面#xff0c;图片的自适应排列是一个无法避免的问题在付出了许多头发的代价之后#xff0c;终于完成了图片排列#xff0c;并封装成组件#xff0c;最终效果如下一、设计思路为了使结构清晰#xff0c;我将图片列表处理成了二维数组#…最近在开发一个批量展示图片的页面图片的自适应排列是一个无法避免的问题在付出了许多头发的代价之后终于完成了图片排列并封装成组件最终效果如下一、设计思路为了使结构清晰我将图片列表处理成了二维数组第一维为行第二维为列render() {const { className } this.props;// imgs 为处理后的图片数据二维数组const { imgs } this.state;return ((this.containerRef ref)}className{className ? w-image-list ${className} : w-image-list}{Array.isArray(imgs) imgs.map((row, i) {return (// 渲染行{Array.isArray(row) row.map((item, index) {return (// 渲染列width: ${item.width}px,}}onClick{() {this.handleSelect(item);}}
);
