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

命令面板

搜索要运行的命令...

文档
推文卡片

推文卡片

一种卡片,用于显示带有作者姓名、用户名和头像的推文。

安装

使用

使用 RSC(Next.js 13)在服务器端渲染

import { TweetCard } from "@/components/magicui/tweet-card";
 
export default async function App() {
  return <TweetCard id="1441032681968212480" />;
}

在客户端渲染

"use client";
 
import { ClientTweetCard } from "@/components/magicui/client-tweet-card";
 
export default function App() {
  return <ClientTweetCard id="1441032681968212480" />;
}

示例

带元数据 URL 预览的推文卡片

属性

ClientTweetCard

属性类型默认值描述
idstring-要显示的推文 ID。

TweetCard

属性类型默认值描述
idstring-要显示的推文 ID。

鸣谢

此组件基于 React Tweet 构建。