[RFC]一个 Form 支持多种布局

[crazyair]

RFC

Summary

在一个表单中支持使用多种布局

Motivation

ref: #31044

Detailed design

<Form.Item layout="horizontal">a</Form.Item>

Drawbacks

无

Alternatives

无

Unresolved questions

无

[afc163]

可以按 https://gist.github.com/michaelcurry/e0132058fcd6d588a1299afd69638df4 这个模板写一下，这样视角比较完整。

[crazyair]

done

[afc163]

Drawbacks 和 Alternatives 都没有么？

[crazyair]

我没想到这2点

[crazyair]

#47525

[MadCcc]

需要 case 支持，补充说明目标

[crazyair]

#47525 这里有加 demo

[zombieJ]

弄些极端的布局例子看看，看看 Grid 是不是也够了

[crazyair]

Grid 会不会增加用户使用成本，现在是想将 Form 的布局功能下放，Form 不做布局工作

[maroon1]

早就要这样做了。
在一些大型表单场景下，很可能不同区域的控件布局不一样，目前的实现，表单状态和表单样式耦合在一起，一个 Form 只能使用同样的布局，这就需要根据布局分成多个 Form，但这样子原本需要统一处理校验和取值就都要分开。
目前我们的项目的做法是只用 Form 组件管理布局，用 react-hook-form 管理表单状态

[crazyair]

有示例吗，看一下

[maroon1]

以这个查询表单为例，第一行表单使用网格的形式布局，第二行时候由于状态需要平铺展开展示，以方便快速切换状态，使用的是 inline 的形式，两种布局的控件实际归属在同一个表单状态管理下会更方便一些，但如果使用 layout="vertical" 的话就要使用 css 来让第二行变成 inline 布局形式了，有点抽象泄漏了，如果能把表单状态管理和表单布局分开的话，就可以灵活布局，避免这个问题

[crazyair]

明白了，更适合搜索条，搜索条会有多种形式