'use client' import { TabGroup } from '@anker-in/headless-ui/biz' import { Text, Picture } from '@anker-in/headless-ui' function TabsDemo() { // 创建演示数据结构 const demoData = { sectionTitle: 'Product Features', theme: 'light' as const, shape: 'rounded' as const, align: 'left' as const, tabs: [ { tabName: 'Power & Performance', tabContent: [ { title: 'Superior Battery Life', description: 'Get up to 48 hours of continuous power with our advanced battery technology.', image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/power-feature.jpg', alt: 'Battery Power Feature', }, features: [ 'Fast charging capabilities', 'Long-lasting battery life', 'Power management system', ], }, ], children: (data: any) => (

{data?.title} {data?.description} {data?.features && (

{feature}

)}

), }, { tabName: 'Design & Build', tabContent: [ { title: 'Premium Materials', description: 'Crafted with high-quality materials for durability and style.', image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/design-feature.jpg', alt: 'Design Feature', }, features: [ 'Aluminum construction', 'Scratch-resistant coating', 'Ergonomic design', ], }, ], children: (data: any) => (

{data?.title} {data?.description} {data?.features && (

{feature}

)}

), }, { tabName: 'Connectivity', tabContent: [ { title: 'Advanced Connectivity', description: 'Stay connected with multiple wireless protocols and fast data transfer.', image: { url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/connectivity-feature.jpg', alt: 'Connectivity Feature', }, features: [ 'Wi-Fi 6 support', 'Bluetooth 5.0', 'USB-C connectivity', ], }, ], children: (data: any) => (

{data?.title} {data?.description} {data?.features && (

{feature}

)}

), }, ], } return }

标签页

基本用法