标记图层

使用插件标记组件或普通图层
本功能使用对象是前端研发。

使用场景

  • 把一个图层标记为组件、物料,转代码时会将该图层识别为组件、物料
  • 给图层标记一些额外的属性,转代码时会带上额外属性

标记内容

每个普通图层(当前支持 Frame、Component、Instance),我们可以标记三个属性:
  • 组件名
  • 包名
  • 其他属性(作为组件的 props)

使用方式

打开插件标记入口,选中需要标记的图层。你可以通过以下方式打开标记入口。

使用案例

给图层添加标记

选中一个普通图层后,我们可以通过标记给图层添加属性信息。这会在您需要消费这个标记时有用,转码后 JSON Schema 会携带这部分信息。
下图,给卡片的 title 图层添加一个 area 属性,值为 header。

标识图层为组件

可以对普通图层或未标记的单个组件进行标记,将其标记为 D2C 可识别的组件。
下图,在表单中输入组件名、包名、组件的属性(可选),将其识别为一个 Button 组件。
如您希望标记属性的值为一个节点类型,需要将标记信息转换为 JSON Schema TreeNode

标记组件库

如您需要对组件库进行标记,我们提供了批量标记组件库的方案。请查看标记组件库

FAQ

哪些类型节点支持自定义标记?

目前支持 Frame、Component、Instance 三种类型。

© 2021 - 2024 Semi Design. All rights reserved.

京ICP备19058139号-13浙公网安备 33011002016131号

Designed & Developed with love by Douyin FE & MED

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