小程序名单滚动

定时器 耗能多

{ {item.username? item.username : '网友'}} 申请了装修补贴

baoming :[
{
username:'张** ’
tel:‘13800138000’
}]

//数据处理，加上 isshow，控制显隐
var getList = res.data.baoming ? res.data.baoming : []
that.setData({
getList: getList,
})
for (let i = 0; i < that.data.getList.length; i++) {
setTimeout(() => {
that.setData({
[‘getList[’ + i + ‘].isShow’]: true
})
setTimeout(() => {
that.setData({
[‘getList[’ + i + ‘].isShow’]: false
})
}, 3900);
}, 2000 * i);
}
处理后的数据
getList:[
{
isShow:false,
username:'张** ’
tel:‘13800138000’
}]

/* 中奖名单动画 */
.nameList{
position: absolute;
-webkit-animation-name: hotDraw;
animation-name: hotDraw;
/关键帧名称/
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
/动画的速度曲线/
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
/动画播放的次数/
-webkit-animation-duration: 4s;
animation-duration: 4s;
/动画所花费的时间/
}
@keyframes hotDraw{
0% {transform:translateX(100px)}
25% {transform:translateX(0px)}
75% {transform:translateY(40px)}
100% {transform:scale(0)}
}