Element-ui组件el-image图片切换功能(:preview-src-list)

Element-ui el-image图片切换功能实现

改造点是在一个页面中,有很多页面需要挨个核对:

在挨个核查图片时,需要一个图片翻页功能,就像微信图片查看功能这个按钮:

经代码核查,使用的是Element-ui的el-image组件,是有一个属性可以把图片放进一个List里面,组件自动进行渲染,这里需要处理一下空值图片即可使用:

给组件加上这个List组件:

在组件里面加上这句来判断List是否有值从而让组件渲染:

    if(this.previewSrcList.length > 0){
        real_src_list = this.previewSrcList;
    }

处理页面的图片:

 return里面处理:

进页面先调load方法,使用addIceImage方法,把需要循环展示的图片装载进iceList进行展示

下面是addIceImage方法的实现方法:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值