← 返回主文档
可选步骤

自定义设置项与移动端适配

纯物料组件通常不需要这些步骤,仅在特定需求下才需要

🎨 自定义右侧设置项组件

如果物料组件需要自定义的右侧属性面板设置项(非 form-create 内置组件),需要额外完成以下步骤:

涉及文件

1. 定义 SettingType

packages/types/form-designer/SettingType.ts
添加 SettingTypeEnum 新值

2. 注册设置项组件

packages/form-designer/src/config/RegisterSettings.ts
映射 SettingType → Vue 组件

3. 创建 settings-helper

packages/form-designer/src/config/settings-helper/<组件名>.ts
定义设置项 schema 和逻辑

何时需要

📱 移动端适配

如果页面 clientType 需要移动端,需在 widget-mobile 目录下创建镜像配置:

涉及文件

1. 移动端 Vue 组件

packages/form-designer/src/widget-mobile/config/widget/<组件名>.vue

2. 移动端 Helper

packages/form-designer/src/widget-mobile/config/widget-helper/<组件名>Helper.ts

3. 移动端注册(必要时)

packages/form-designer/src/widget-mobile/config/RegisterWidget.ts
RegisterWidgetHelper.ts
Material.ts

何时需要

🔍 过滤器 / 列表 / 单据体支持

如果物料组件需要进入过滤器、列表或单据体体系:

涉及文件

1. 过滤器类型

packages/types/form-designer/components/filter/constants.ts
添加 FilterTypeEnum

2. 过滤器组件映射

packages/form-designer/src/components/filter/constants.ts
添加过滤器组件映射

3. 列表只读渲染

packages/form-designer/src/config/widget/table/FieldViewMap.ts
添加列表/单据体详情只读映射

何时需要

💡 总结

对于普通纯物料组件(如 CommonBtn、CommonTxt、GroupPanel),以上步骤都可以跳过

只有在组件有特定复杂需求时,才需要按需补充这些可选步骤。