隆重推出 Magic UI Pro - 50+ 区块和模板,助您在几分钟内构建精美着陆页。

文档
动态订阅按钮

动态订阅按钮

一个动态订阅按钮,可用于显示从初始状态到最终结果的微动画。

安装

用法

import { AnimatedSubscribeButton } from "@/components/magicui/animated-subscribe-button";
<AnimatedSubscribeButton>
  <span>Follow</span>
  <span>Subscribed</span>
</AnimatedSubscribeButton>

属性

属性类型默认值描述
subscribeStatusbooleanfalse一个布尔标志,用于检查按钮的状态。此属性可用于切换按钮的状态,例如已订阅或未订阅。
childrenReact.ReactNode-按钮内部显示的内容。应包含两个子元素——第一个用于未订阅状态,第二个用于已订阅状态。
classNamestring-可选的类名,用于按钮的自定义样式。

致谢