welcome.vue 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637
  1. <script setup lang="tsx">
  2. import SemanticPreview from '../.vitepress/vitepress/components/semantic/preview.vue'
  3. import { Welcome } from 'ant-design-x-vue'
  4. import { Button, Space } from 'ant-design-vue';
  5. import {ShareAltOutlined, EllipsisOutlined} from '@ant-design/icons-vue'
  6. defineRender(() => {
  7. return (
  8. <SemanticPreview semantics={[
  9. { name: 'icon', desc: '图标容器' },
  10. { name: 'title', desc: '标题容器' },
  11. { name: 'description', desc: '描述容器' },
  12. { name: 'extra', desc: '额外内容' },
  13. ]}
  14. >
  15. {({ classNames }) => {
  16. return (
  17. <Welcome
  18. classNames={classNames}
  19. icon="https://mdn.alipayobjects.com/huamei_iwk9zp/afts/img/A*s5sNRo5LjfQAAAAAAAAAAAAADgCCAQ/fmt.webp"
  20. title="Hello, I'm Ant Design X"
  21. description="Base on Ant Design, AGI product interface solution, create a better intelligent vision~"
  22. extra={
  23. <Space>
  24. <Button size="small" icon={<ShareAltOutlined />} />
  25. <Button size="small" icon={<EllipsisOutlined />} />
  26. </Space>
  27. }
  28. ></Welcome>
  29. )
  30. }
  31. }
  32. </SemanticPreview>
  33. )
  34. })
  35. </script>