Cell 宫格

Cell Props

名称 类型 默认值 描述 必传
className String - 类名 N
style Object - 样式,TS 类型:React.CSSProperties N
align String middle 内容的对齐方式,默认居中对齐。可选项:top/middle/bottom N
arrow Boolean false 是否显示右侧箭头 N
bordered Boolean true 是否显示下边框 N
description TNode - 下方内容描述。TS 类型:string | TNode通用类型定义 N
hover Boolean - 是否开启点击反馈 N
image TNode - 主图。TS 类型:string | TNode通用类型定义 N
leftIcon TElement - 左侧图标,出现在单元格标题的左侧。TS 类型:TNode通用类型定义 N
note TNode - 和标题同行的说明文字。TS 类型:string | TNode通用类型定义 N
required Boolean false 是否显示表单必填星号 N
rightIcon TElement - 最右侧图标。TS 类型:TNode通用类型定义 N
title TNode - 标题。TS 类型:string | TNode通用类型定义 N
onClick Function TS 类型:(context: { e: MouseEvent }) => void
右侧内容。TS 类型:string | TNode通用类型定义
N

CellGroup Props

名称 类型 默认值 描述 必传
className String - 类名 N
style Object - 样式,TS 类型:React.CSSProperties N
bordered Boolean false 是否显示组边框 N
theme String default 单元格组风格。可选项:default/card N
title String - 单元格组标题 N

常见用法

常用作内容详情入口或功能入口的平铺陈列。

常用作同类型同格式信息项平铺陈列。

推荐/慎用示例

作为入口时,不建议承载过多过复杂的内容。

作为入口时,不建议在一个单元格内承载其他操作。

相似组件

组件名 何时使用
宫格 当需要展示多个功能或信息入口,且这些入口没有明显的优先级时使用。