提交时重定向React表单组件。 React Router v5.1

Question

目标-我有一个用于更新产品详细信息的表格。我想在提交表单时重定向到首页。

问题是我正在从Form组件向主App组件发送表单数据，以更新产品列表。这些产品处于我的App状态，并作为道具传递给我的Form，这会导致Form组件的重新渲染。

Form的标志状态在构造函数toHome: false中设置为false。我的计划是在标志设置为true时利用react-router的Redirect进行触发。

在EditForm handleSubmit方法中，有一个setState({ toHome: true })。但是handleSubmit中的ALSO是用于更新处于App状态的产品的方法（从App作为属性传递）。

TLDR->FormhandleSubmit更新产品-> Form重新渲染->在构造函数中将重定向标志（toHome）设置为false->重定向从未发生。

即使我想添加简短的成功消息，我也有同样的问题。我被困在这里太久了。

Answer 1

我认为您需要对隐含的含义进行澄清，因此请提供一些小提琴或其他内容。

同时，我想的是，您需要在提交表单时进行重定向吗？

如果是这种情况，

import { useHistory } from "react-router-dom"; 

和做

  let history = useHistory();
  function handleSubmit() {
    props.handleSubmit() // the one that comes from your App
    history.push("/home");
  }

一旦您提供更多信息，我将相应地编辑答案。