Vue + Element UI 实现闭眼图标动画

<template>
  <div>
    <el-icon :class="{ 'is-rotate': isRotate }" name='el-icon-close'></el-icon>
  </div>
</template>
<script>
export default {
  data() {
    return {
      isRotate: true
    }
  },
  mounted() {
    setTimeout(() => {
      this.isRotate = false
    }, 1000)
  }
}
</script>
<style>
.is-rotate {
  animation: rotate 1s linear infinite;
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
</style>