formily代码结构

输入控件：inputs 

布局控件：Layouts

自增控件：Arrays 

展示控件：Displays 

拖拽组件：Component

大纲树组件：OutlinedTree

历史记录：History

左侧导航栏：CompositePanel.DragSourceWidget

顶部操作：ToolbarPanel

拖拽面板：type=\"DESIGNABLE\"

json树编辑控件：type=\"JSONTREE\"

代码树：type=\"MARKUP\"

表单预览：type=\"PREVIEW\" PreviewWidget

操作区域：ViewportPanel.ViewPanel

中心工作区：Workspace

const node = useCurrentNode(currentWorkspaceId)配置项：node?.designerProps?.propsSchema配置项数据：node?.props渲染配置面板

配置面板：SettingsPanel.SettingsForm

<Form {...formProps} form={form}>      <SchemaField schema={schema} />    </Form>

PreviewWidget：核心表单渲染

@formily/core

transformToSchema

@designable/formily

useDesignerconst designer = useDesigner()

@designable/react

@formily/antd

designable/antd/src/schemas

designable/antd/src/sources

获取提交结果：const submit = async (designer: Engine) => {    const fr = formRef.formRef.current.getForm();    await fr.validate('dk822gxacmz');    console.log(fr.values)  };

保存/提交ActionsWidget.tsx

初始化

配置面板designable/antd/src/schemas

拖拽面板注册designable/antd/src/components/DesignableField/options.ts：import { MtdInput } from '@formily/antd'const SchemaField = createSchemaField({  components: { MtdInput }})

表单注册designable/antd/playground/widgets/PreviewWidget.tsx：import { MtdInput } from '@formily/antd'const SchemaField = createSchemaField({  components: { MtdInput }})

新增组件步骤

main.ts