🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
手机端缩略图列表数据加载后事件,普通列表和表格列表不会触发此事件 **返回值** 无 **参数** | 名称 | 类型 | 描述 |非空 | --- | --- | --- |--- | | thumb| jQuery对象|当前缩略图对象 |是 | data| object|当前缩略图对应的数据,data.Name是个字符串组合的数据,可以先用data.Name.split('\v')得到每列数据信息,然后每列再split('\f')得到该列的相关数据 |是 **代码** ``` function afterShowThumbXXXXXX(thumb,data){ //注:实际书写脚本时应将方法名的XXXXXX替换为当前列表的ID,实际方法名应该类似这样:afterShowThumb800001(e) //假如缩略图模板如下: /* <div style="border: .5px solid #1e90ff; box-shadow: 2px 2px 25px #cac6c6; " tag="1"> <div style=" border: .5px solid #1e90ff; " tag="1"><label style="display: inline-block;text-align:center;width: 80px;padding: 8px;background: #1e90ff;color: #fff;">时间</label> <div style=" display: inline-block; color: #1e90ff; width: 200px; text-align: center; " tag="2"><span columnindex="1">##日期##</span></div> </div> <div style=" border: .5px solid #1e90ff; " tag="1"><label style="display: inline-block;text-align:center;width: 80px;padding: 8px;background: #1e90ff;color: #fff;">类型</label> <div style=" display: inline-block; color: #1e90ff; width: 200px; text-align: center; " tag="2"><span columnindex="2">##类型名称##</span></div> </div> <div style=" border: .5px solid #1e90ff; " tag="1"><label style="display: inline-block;text-align:center;width: 80px;padding: 8px;background: #1e90ff;color: #fff;">菜单</label> <div style=" display: inline-block; color: #1e90ff; width: 200px; text-align: center; " tag="2"><span columnindex="3">##菜单##</span></div> </div> </div> */ let vs = data.Name.split('\v'); let types = vs[1].split('\f'); let c = types[1] == '早餐' ? '#ffa500' : types[1] == '晚餐' ? '#99cc99' : ''; if (c) { thumb.find('[tag=1]').css('borderColor', c); thumb.find('[tag=2]').css('color', c); thumb.find('label').css('background', c); } } ``` 运行效果: ![](https://img.kancloud.cn/00/04/0004764b9dae10086209d4cbed9b10f6_801x1585.png)