<template>
	<view class="box" :class="{ 'is-loading': loading }">
		<text class="iconfont icon-loading" :style="{color:loadColor}"></text>
	</view>
</template>

<script>
export default {
  props: {
    loading: {
      type: Boolean,
      default: false
    },
	loadColor: {
	  type: String,
	  default: '#fff'
	  
	}
  }
}
</script>

<style scoped lang="scss">
.box {
  color: #fff;
  /* 初始状态不旋转 */
  transform: rotate(0deg);
  transition: transform 0.3s;
}

.box.is-loading {
  font-size: 24rpx;
  /* 无限旋转动画 */
  animation: rotating 1s linear infinite;
}

@keyframes rotating {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
</style>