ant-design-vue/components/card/demo/index.vue

59 lines
1.3 KiB
Vue

<script>
import Basic from './basic'
import NoBorder from './noBorder'
import Concise from './concise'
import ColRowCard from './colRowCard'
import Loading from './loading'
import Grid from './grid'
import Inline from './inline'
import TabsCard from './tabsCard'
import MoreConfigs from './moreConfigs'
import CN from './../index.zh-CN.md'
import US from './../index.en-US.md'
import '../style'
const md = {
cn: `# Card 卡片
通用卡片容器
## 何时使用
最基础的卡片容器,可承载文字、列表、图片、段落,常用于后台概览页面。
## 代码演示
`,
us: `# Card
Simple rectangular container.
##When To Use
A card can be used to display content related to a single subject. The content can consist of multiple elements of varying types and sizes.
## Examples
`,
}
export default {
category: 'Components',
type: 'Data Display',
title: 'Card',
subtitle: '卡片',
cols: 1,
render () {
return (
<div>
<md cn={md.cn} us={md.us} />
<Basic />
<NoBorder />
<Concise />
<ColRowCard />
<Loading />
<Grid />
<Inline />
<TabsCard />
<MoreConfigs />
<api>
<CN slot='cn' />
<US />
</api>
</div>
)
},
}
</script>