旋转器

安装

npm install @cypress-design/vue-spinner

或者用纱线

yarn add @cypress-design/vue-spinner

使用量

import Spinner from '@cypress-design/vue-spinner'

您可以使用默认自旋器, 并手动导入样式 .

<script setup>
import Spinner from '@cypress-design/vue-spinner'
import '@cypress-design/vue-spinner/style.css'
</script>

<template>
  <div class="flex flex-col items-center justify-center gap-[12px] h-[20vh]">
    <Spinner />
    <h2 class="text-gray-700 text-size-16px leading-[24px]">
      Initializing something really important...
    </h2>
  </div>
</template>

...或直接导入 Spinner SG 并将其用作组件 .

• 说明 /sfc 在导入行的末尾

<script setup>
import Spinner from '@cypress-design/vue-spinner/sfc'
</script>

<template>
  <div class="flex flex-col items-center justify-center gap-[12px] h-[20vh]">
    <Spinner />
    <h2 class="text-gray-700 text-size-16px leading-[24px]">
      Initializing something really important...
    </h2>
  </div>
</template>