通用原则
大图类型下,所有的信息及操作,均在卡片上显示
卡片本身均带链接,点击后前往对象详情页
小图模式下,图片上尽量不要有额外的操作
文字模式下,中文取首字符的拼音首音节,英文取首字母,并大写显示
大图类型下,所有的信息及操作,均在卡片上显示
卡片本身均带链接,点击后前往对象详情页
小图模式下,图片上尽量不要有额外的操作
文字模式下,中文取首字符的拼音首音节,英文取首字母,并大写显示
大图模式的基本用法展示
小图模式,不带任何操作
小图模式,不带任何操作
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
img | 封面图片,必填 | String | - |
title | 封面标题,必填 | React node | - |
extra | 封面操作区 | React node | - |
description | 封面描述 | React node | - |
tag | 封面标签 | String | - |
link | 封面点击跳转地址,必填 | String | - |
target | 封面点击打开窗口,同a元素target | String | - |
onMouseEnter | 鼠标悬浮触发事件 | Function | noop |
onMouseLeave | 鼠标离开触发事件 | Function | noop |
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
src | 封面图片地址,必填 | String | - |
size | 封面图片尺寸,可选值'xs', 'small', 'medium', 'large', 'xl' | String | 'medium' |
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
text | 封面文字,必填 | String | - |
size | 封面尺寸,可选值'xxs', 'xs', 'small', 'medium', 'large', 'xl', 'xxl' | String | 'medium' |
colorSets | 封面背景色集,会根据text的charCode选取其中一个作为背景色 | String数组 | '#BC61CF', '#F26666', '#F29A52', '#F4C329', '#CBD057', '#289ED3', '#29B3F0' |