支持组件列表

支持的 Semi 组件和 Figma 节点类型

已支持的 Semi 组件

组件名组件类型备注
Avatar
基础组件
含 AvatarGroup
Button
基础组件
含 ButtonGroup
Badge
基础组件
Icon
基础组件
Tag
基础组件
Typography
基础组件
2023.05 支持
Checkbox
表单组件
含 CheckboxGroup
Cascader
表单组件
DatePicker
表单组件
Form
表单组件
2023.01 支持
Input
表单组件
含 TextArea
InputNumber
表单组件
TagInput
表单组件
Radio
表单组件
Rating
表单组件
含 RadioGroup
Switch
表单组件
Slider
表单组件
Select
表单组件
TimePicker
表单组件
Transfer
表单组件
TreeSelect
表单组件
Upload
表单组件
Card
展示组件
2023.05 支持
Collapse
展示组件
2023.05 支持
Descriptions
展示组件
2023.05 支持
Dropdown
展示组件
2023.01 支持
Empty
展示组件
2023.01 支持
List
展示组件
2023.05 支持
Modal
展示组件
2023.05 支持
Popover
展示组件
2023.05 支持
SideSheet
展示组件
2023.05 支持
Table
展示组件
2022.12 支持
Timeline
展示组件
2023.05 支持
Tooltip
展示组件
2023.05 支持
Anchor
导航组件
2023.05 支持
Breadcrumb
导航组件
2023.01 支持
Navigation
导航组件
2023.05 支持
Pagination
导航组件
2023.01 支持
Tabs
导航组件
2023.01 支持
Steps
导航组件
2023.05 支持
Banner
反馈组件
2023.01 支持
Popconfirm
反馈组件
2023.05 支持
Progress
反馈组件
2023.05 支持
Skeleton
反馈组件
2023.05 支持
Spin
反馈组件
2023.05 支持

不支持的 Semi 组件

组件名组件类型备注
Divider
基础组件
布局相关
Grid
基础组件
布局相关
Layout
基础组件
布局相关
Space
基础组件
布局相关
AutoComplete
输入组件
不需要
Calendar
展示组件
暂不支持
Carousel
展示组件
暂不支持
Collapsible
展示组件
暂不支持
Highlight
展示组件
不需要
Image
展示组件
暂不支持
OverflowList
展示组件
不需要
ScrollList
展示组件
不需要
BackTop
导航组件
不需要
Tree
导航组件
暂不支持
Toast
反馈组件
组件是命令式调用
Notification
反馈组件
组件是命令式调用

D2C 支持转换的 Figma 节点类型

描述节点类型支持状态支持形式
frame 节点
FrameNode
div
组件
ComponentNode
div 或 Semi 组件或 Semi Icon如果是不支持的组件或实例,则绘制为 div
组件实例
InstanceNode
div 或 Semi 组件或 Semi Icon如果是不支持的组件或实例,则绘制为 div
文本节点
TextNode
p
分组节点
GroupNode
div
四边形节点
RectangleNode
div
椭圆节点
EllipseNode
div
矢量节点
VectorNode
img
线
LineNode
img
多边形节点
PolygonNode
img
布尔操作
BooleanOperationNode
img
多角星
StarNode
img
有形状的文本
ShapeWithTextNode
-
切片是一个带边框的不可见对象,在编辑器中表示为虚线
SliceNode
-
通过 Stamp Wheel 插入的节点
StampNode
-
便利贴对象
StickyNode
-
代码块
CodeBlockNode
-
所有类型的节点
All
img只要有 export 属性,就导出为图片;如果子级都是被转换为 img,那么自身也会被转换为 img
  • 开始
    • 介绍
    • 快速开始
    • 选型对比
    • 相关术语
    • 常见问题
    • 更新日志
  • 研发使用手册
    • 标记组件库
    • 标记图标库
    • 标记图层
    • 设计稿检查
    • 转码插件
    • 常见问题处理
      更新
    • 基础转换原理
    • 转码设置
      更新
  • 设计使用手册
    • 使用 Semi Variants
    • 自定义 Variants
    • 设计稿检查
    • 设计侧最佳实践
      更新
  • 更多
    • 联系我们
    • 路线图
    • JSON Schema
    • 已知问题