我如何重定向在 reactjs 中提交我的表单并使用 formik

Question

重定向不工作，我如何重定向我正在使用功能组件。

const [redirect,setredirect]=useState(false);
const onSubmit = (values,{resetForm}) => {
    console.log('Form data', values);
    setredirect(true);
    if(redirect)
    {
        return <Redirect to='/' />
    }

Answer 1

您可以使用 history.push 重定向。

const history = useHistory()
history.push('/')

顺便说一句，检查 redirect 是否为真的条件将不起作用，因为 setRedirect 是异步的。您根本不需要 redirect 状态。

const onSubmit = async (values) => {
  // Send an API request with the values
  // await makeAPICall(values)
  history.push('/')
};

Answer 2

问题在于设置状态不会（必然）同步更改它，因此如果您在设置状态后立即检查状态，它可能仍然包含旧值。在 React 中，设置状态不会立即改变状态，而是创建一个挂起的状态转换。如果您需要在设置后立即可靠地访问新状态，只需将其保存到一个临时变量即可：

let shouldRedirect = true; // I'm assuming this is not hard-coded or the if statement makes no sense.
setredirect(shouldRedirect);
if (shouldRedirect) {
  // Do something 
}

我如何重定向在 reactjs 中提交我的表单并使用 formik

How can i redirect on submitting my form in reactjs and using formik

reactjs

react-router-dom

formik