现在在使用编辑/新增弹出drawer时,通常是这样:
edit:{ type: 'void', title: '{{ t("Edit") }}', 'x-component': 'Action.Link', 'x-component-props': { icon: 'EditOutlined', openMode: 'drawer', openSize: 'middle', }, 'x-action': 'update', 'x-acl-action': 'XXX:update', 'x-action-context': { 'dataSource': 'main', 'collection': 'XXX', }, 'x-decorator': 'ACLActionProvider', properties: { drawer: { type: 'void', title: '{{t("Edit record")}}', 'x-component': 'Action.Container', 'x-decorator': 'FormBlockProvider', 'x-use-decorator-props': 'useEditFormBlockDecoratorProps', 'x-decorator-props': { action: 'get', dataSource: 'main', collection: 'XXX', }, properties: { content: { type: 'void', 'x-decorator': 'FormV2', 'x-use-decorator-props': 'useEditFormBlockProps', 'x-decorator-props': { layout: 'horizontal', labelAlign: 'right', labelWidth: 100, labelWrap: true, }, properties: { items: PointZoneEditSchema, footer: { type: 'void', 'x-component': 'Action.Container.Footer', properties: { submit: { type: 'void', title: '{{t("Submit")}}', 'x-component': 'Action', 'x-use-component-props': 'useUpdateActionProps', 'x-component-props': { type: 'primary', // htmlType: 'submit', icon: 'SaveOutlined', }, }, cancel: { type: 'void', title: '{{t("Cancel")}}', 'x-component': 'Action', 'x-use-component-props': 'useCancelActionProps', 'x-component-props': { icon: 'CloseOutlined', }, }, }, }, }, }, }, }, }, };
由于要三层:
‘x-decorator’: ‘ACLActionProvider’,
‘x-decorator’: ‘FormBlockProvider’,
‘x-decorator’: ‘FormV2’,
提交按钮在最内层,使用’x-component’: 'Action.Container.Footer’没有效果。
能否通过配置多个x-decorator来减少嵌套的层数呢?
或者有其他解决办法?