AnimateCreditsButton

带流光动画 + 积分显示的按钮，继承 AnimateButton 的全部能力，在文字右侧额外展示积分数量或订阅图标。如果不需要动画效果，请使用 CreditsButton。

基本用法

显示积分

<script setup lang="ts">
import { AnimateCreditsButton } from '@tripo3d/design';
</script>

<template>
  <AnimateCreditsButton :credits="100">生成模型</AnimateCreditsButton>
</template>

订阅模式

subscribe

开启 subscribe 后用订阅图标替代积分图标。

<AnimateCreditsButton :credits="1234" subscribe>订阅升级</AnimateCreditsButton>

API

Props

继承 AnimateButton 的所有 Props，额外提供：

名称	类型	默认值	说明
credits	number	—	积分数量，显示在文字右侧
subscribe	boolean	—	使用订阅图标替代积分图标
iconClass	string	—	积分/订阅图标的 class

Slots

插槽	作用域	说明
default	—	按钮主文字