标记表格

使用插件标记表格和表格列
本功能使用对象是前端研发。
通过标记功能给 Table 添加一些组件相关的属性,转码时会使用这些标记信息。
对于表格的基础转码,你可以不标记直接对 Table 转码,插件会自动识别表格的属性信息(见下方),在转码完成后,在您的项目代码编辑器里对表格进行二次修改。

标记内容(可选)

对于 Table Column,我们可以标记以下属性:
  • title
  • dataIndex
  • 其他属性:透传给 column props
除此之外,你可以查看Semi Table 文档了解更多关于表格的属性信息。

使用方式

唤起标记

标记 Table 的入口与标记普通图层一样。

开始标记

选择列或者表格,标记相应属性。选择 Table 时,面板会聚合列以方便标记所有列。选择列时,您只能标记当前一列。
标记时,插件会把标记信息保存在对应的图层上。关闭插件、或者复制图层后标记信息也还在。

完成标记

点击完成标记后,开始转码获取代码或者 JSON Schema。

表格属性自动提取

对于 Table 和 Table.Column,插件会自动帮我们提取一些属性。研发可以打开插件的标记功能对自动提取的属性二次修改。当然,也可以不修改。
组件自动提取的属性备注
TablerowSelection、bordered、size、pagination、columns、dataSource(空数据)
Table.Columntitle、render、fixed、align、width、filters、sorterfilter、sorter 仅识别是否包含该属性,标记信息为 hasFilter 和 hasSorter

使用示例

安装插件 后,点击 try it out 进入 playground。
选择 Simple Table 图层进行转码。

FAQ

任意表格都能标记吗?

必须使用 Semi 插件插入到画布的表格,它有一定的图层结构和图层的命名约束。
  • 开始
    • 介绍
    • 快速开始
    • 选型对比
    • 相关术语
    • 常见问题
    • 更新日志
      更新
  • 研发使用手册
    • 代码转译
    • 标记组件库
    • 标记图标库
    • 标记图层
    • 设计稿检查
      更新
    • 转码插件
      更新
    • 故障排除
    • 基础转换原理
    • 支持组件列表
    • 全局设置
      更新
  • 设计使用手册
    • 使用 Semi Variants
    • 自定义 Variants
    • 设计稿规范
    • 使用 Table 组件
    • 使用 Form 组件
    • 迁移旧设计稿
  • 更多
    • 联系我们
    • 路线图
    • JSON Schema
    • 已知问题