vue 刷新icon小动效

点击icon图标，旋转一周。
最先尝试的逻辑是，给一个控制参数refresh，初始false，icon绑定两个样式，类似以下：

<i :class="[refresh? 'el-icon-refresh go' : 'el-icon-refresh']" @click="iconClick"></i>&emsp;

el-icon-refresh是elementui自带图标

.go {
  transform: rotate(360deg);
  transition: all 1s;
}

iconClick点击时refresh状态为true，接口数据返回成功后再变为false

逻辑是没毛病的，但是transition给的时间时1s，接口速度小于1s时，点击起来就会很奇怪，icon还未旋转完就被强行终止，甚至只是抖动一下，操作起来感觉像喉咙里卡了一口浓痰。

优化如下：

<i :class="[refresh? 'el-icon-refresh go' : 'el-icon-refresh']" @click="iconClick"></i>&emsp;

.go {
  transform: rotate(360deg);
  transition: all 1s;
}

data{
	refresh:false,
}
...
methods:{
	iconClick(){
		this.refresh = !this.refresh;
		setTimeout(() => {
			this.refresh = !this.refresh;
		},1000)
	}
}

不在接口返回中设置false，让延迟时间等于transition时间即可。
如果有更好的办法欢迎交流。