Skip to content

form 组件在layout为vertical时,修改表单项宽度异常 #7581

@hanyefeng

Description

@hanyefeng
  • I have searched the issues of this repository and believe that this is not a duplicate.

Version

4.2.1

Environment

vue3.2.36

Reproduction link

Edit on CodeSandbox

Steps to reproduce

我在封装ant-design-vue时发现,在layout为vertical时 修改表单项宽度表现不太符合预期,
宽度变成了表单项宽度加上label宽度。

What is expected?

期望和ant-design一样,可以灵活修改表单项宽度

What is actually happening?

对比ant-design发现,ant-design-vue 的ant-form-item的子元素class名为ant-form-row 而不是ant-form-item-row,这样导致
.ant-form-vertical .ant-form-item-row { flex-direction: column } 样式丢失,子元素宽度会额外多一个label的宽度

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions