reactjs - 使用 React 和 Django Rest 框架的多步表单处理

Question

我有一个三步表格在数据库中添加一个故事

当用户填写第一步表格时，所有第一步数据将被添加到故事表中，用户将被重定向到第二步。我已经为第一步、第二步、第三步写了三个视图。

我的问题是我应该如何管理第二步视图和第三步视图？我应该如何更新第二步和第三步的故事？我应该将 id 发送回前端并将其存储在 redux 中吗？然后将该 id 发送到后端进行第二步和第三步？

另外我应该如何重用这个表单来响应更新？

如果需要，我可以提供更多详细信息

标签： reactjsdjango-rest-frameworkmulti-step

Answer 1

我相信没有“一刀切”的解决方案，但总的来说你的想法是正确的。如果有后端知道而前端不知道的数据，则将其作为响应发回。所以这将是这样的：

1. 将表单发送到后端
2. 带有“OK”的后端响应加上前端需要知道的数据，或者如果出现问题则带有错误
3. 继续下一步并执行 1 直到完成

您也可以将所有三个步骤中的所有数据存储在前端，然后将其一次性发送 - 在这种情况下，您最终不会在 DB 中获得部分填充的数据，但是您将不得不考虑导航到错误字段/steps 如果出现问题并且会使事情复杂化。

至于组件重用，我有意见：如果您可以保持组件可维护和可替换 - 重用它。

编辑：如果您使用反应，您可能不需要通过后端重定向用户，而只需通过反应切换步骤（使用客户端路由器或状态中的普通“步骤”值），具体取决于您的需要。