跳转到内容

物料协议

物料协议是 CMaterialType。它不是 React 组件本身,而是 Engine 对组件库、属性面板和拖拽规则的描述。

核心字段

字段必填用途
componentName与 Schema、React 组件一一对应
title编辑器展示名称
snippets拖入时生成的默认节点
props可编辑属性及 setter
category / groupName / tags分类、分组、搜索
isContainer允许子节点拖入
events / methods事件流程和方法调用
npm组件库元信息
advanceCustom高级面板、DOM 与编辑行为

示例

import type { CMaterialType } from '@chamn/model';
export const CardMeta: CMaterialType = {
componentName: 'Card',
title: '卡片',
category: '布局',
tags: ['容器', '内容'],
isContainer: true,
snippets: [{ componentName: 'Card', props: { title: '卡片标题' }, children: [] }],
props: [
{
name: 'title',
title: '标题',
valueType: 'string',
defaultValue: '卡片标题',
setters: ['StringSetter'],
},
],
};

设计约束

  • componentName 改名等同 breaking change,需迁移旧 Schema。
  • snippets 默认 props 必须能被 React 组件直接接受。
  • props 字段名必须与真实组件 props 对齐,setter 只负责编辑值。
  • React 组件可有未暴露 props,但业务用户无法通过编辑器配置。
  • 需要自定义输入控件时,先注册 setter,再在 props.setters 引用其名称。

关联文档:物料介绍内置 Setter自定义 Setter