基于uview1.x
<u-icon name="reload" size="40" :class="[refresh? 'refresh-color rotateIcon' : 'refresh-color']"
@click="isRotate">
</u-icon>
data() {
return {
poster: {
refresh: false,
},
}
},
methods: {
isRotate() {
if (this.timer) return
uni.showLoading({
title: "加载中"
})
this.refresh = !this.refresh;
this.timer = setTimeout(() => {
this.refresh = !this.refresh;
this.ajax请求();
uni.hideLoading()
uni.showToast({
title: "刷新成功",
icon: "none"
})
}, 5000)
}
}
<style>
.refresh-color {
color: #d5a65a;
padding: 20rpx;
}
.rotateIcon {
transform: rotate(1800deg);
transition: all 5s; // 可配置
}
</style>