开发具有 15 个字段的表单的最佳过程是什么，特别是使用 React JS，语义 UI 而没有 Redux 或任何其他

Question

我正在尝试创建一个长格式页面，每个页面将有 5 个字段，并带有 continue 按钮。编码对齐的最佳格式是什么，尤其是在仅使用功能组件的 React js 中。

我有 3 种方法。

1. 将每个页面字段保存在不同的页面中，如 page1、page2、page3，然后在父级中访问。
2. 将所有字段保存在一个文件中，并通过传递页码使用 switch case 访问这些字段。
3. 将所有字段保留在一页中并加载所有字段，但根据页码隐藏一些字段。

如果有任何其他最佳标准方法可以减少未来的维护、更少的代码更改、更少的重复代码等等……请开处方听听。

Answer 1

根据我的说法，最好的方法是制作一个 component 来保存所有表单值并有条件地将它们呈现在屏幕上。您可以做的是，创建三个 div，它们将有条件地呈现，例如：

{ step === 1 && <div>{"Your form here"}</div>}

这种方法最好的部分是您将所有 form 数据放在一个地方。然后您可以轻松将该数据传递给 API 并发出请求。