diff --git a/src/components/Form/src/hooks/useLabelWidth.ts b/src/components/Form/src/hooks/useLabelWidth.ts index 7fcc021..f994985 100644 --- a/src/components/Form/src/hooks/useLabelWidth.ts +++ b/src/components/Form/src/hooks/useLabelWidth.ts @@ -10,7 +10,7 @@ export function useItemLabelWidth(schemaItemRef: Ref, propsRef: Ref< const { labelCol = {}, wrapperCol = {} } = schemaItem.itemProps || {}; const { labelWidth, disabledLabelWidth } = schemaItem; - const { labelWidth: globalLabelWidth, labelCol: globalLabelCol, wrapperCol: globWrapperCol } = unref(propsRef); + const { labelWidth: globalLabelWidth, labelCol: globalLabelCol, wrapperCol: globWrapperCol,layout } = unref(propsRef); // update-begin--author:sunjianlei---date:20211104---for: 禁用全局 labelWidth,不自动设置 textAlign -------- if (disabledLabelWidth) { @@ -34,8 +34,11 @@ export function useItemLabelWidth(schemaItemRef: Ref, propsRef: Ref< } return { - labelCol: { style: { width }, ...col }, - wrapperCol: { style: { width: `calc(100% - ${width})` }, ...wrapCol }, + labelCol: { style: { width: width ? width : '100%' }, ...col }, + wrapperCol: { + style: { width: layout === 'vertical' ? '100%' : `calc(100% - ${width})` }, + ...wrapCol, + }, }; }); } diff --git a/src/views/demo/page/form/high/index.vue b/src/views/demo/page/form/high/index.vue index f8709a3..a0cdebf 100644 --- a/src/views/demo/page/form/high/index.vue +++ b/src/views/demo/page/form/high/index.vue @@ -33,6 +33,8 @@ baseColProps: { span: 6, }, + labelWidth: 200, + layout: 'vertical', schemas: schemas, showActionButtonGroup: false, }); @@ -41,6 +43,8 @@ baseColProps: { span: 6, }, + labelWidth: 200, + layout: 'vertical', schemas: taskSchemas, showActionButtonGroup: false, });