实现点击icon图标,旋转一周
通过ElementUI实现刷新动画
<i :class="[refresh_flag? 'el-icon-refresh refreshIcon' : 'el-icon-refresh']" @click="refreshClick"></i>
refreshClick点击时refresh_flag状态为true,接口数据返回成功后再变为false
.refreshIcon { transform: rotate(360deg); transition: all 1s; }
refresh_flag状态为true,使icon旋转一周
data{ return { refresh_flag: false } }, methods:{ refreshClick(){ this.refresh_flag = !this.refresh_flag; // 执行代码逻辑 ...... setTimeout(() => { this.refresh_flag = !this.refresh_flag; },1000) } }
标签:动画,vue,refresh,flag,refreshClick,刷新,icon From: https://www.cnblogs.com/zj68/p/17567395.html