利用java后台type值给wx:for生成的列表添加不同的图标
哈哈:我们在开发微信小程序时写一个列表时,往往只写列表的其中一个然后利用wx:for循环出来整个列表wxml代码如下:
<view class='index-item-bg'> <view class='index-item'> <view class='index-item-box' wx:for="{{shortcutList}}" style='background-color:#b5d6f1' data-pos='{{index}}' bindtap='tiao'> <image class='index-item-box-image' src='../../../images/icon/icon{{item.type}}.png'></image> <view class='icon-box-ctn'> <view class='index-item-box-title'>{{item.name}}</view> <view class='index-item-box-desc'>国家一级机器人培训单位</view> </view> </view> </view> </view>
生成的列表的效果图如下:

这个就是用wx:for循环出来的,但是如果换前面的图标的话如果用常规的做法是做不出来的但是如果利用type值的话一行代码就解决啦就是上面代码images标签里面的
<image class='index-item-box-image' src='../../../images/icon/icon{{item.type}}.png'></image>
其实起作用的就这一句{{item.type}}然而是什么意思呢icon{{item.type}}组合其实是图片的名字如下图images文件夹下的icon文件里面的图片所示:

讲到这有些同学应该明白啦吧其实有些东西思想不要局限最终效果如下:

本人原创博客希望大家提出意见:
浙公网安备 33010602011771号