多个 React-Router 重定向失败而没有按时重定向答案

【问题标题】：Multiple React-Router Redirects Fall Through without Redirecting on Time多个 React-Router 重定向失败而没有按时重定向
【发布时间】：2021-08-17 07:44:37
【问题描述】：

在我的组件渲染的顶部，我有一系列条件路由器<Redirect>s。不是If-Else，但是理解是如果满足条件，就会重定向。

但是，我发现这些<Redirect>s 不知何故失败了。如果满足第三个条件，它将是最后一个执行重定向的，即使第一个也满足。当满足第一个条件时，调试器不会停止并继续渲染组件。

{/* If form is submitted in the Submit mode with the ChangeApprover scenario, redirect to /agreements with the Submit ChangeApprover success message */}
{ (isFormSubmitted && submitValidationMode && isChangeApprover) 
  &&
    <Redirect to={"/agreements?result=submitChangeApprover&approver=" + encodeURIComponent(detailedApproverUserInfo ? detailedApproverUserInfo.firstName_lastName_regular : "N/A")} /> 
} 

{/* If form is submitted in the Submit mode from the Renew mode, redirect to /agreements with the Renew success message */}
{ (isFormSubmitted && submitValidationMode && props.mode === 'renew') 
  &&
    <Redirect to={"/agreements?result=renew&approver=" + encodeURIComponent(detailedApproverUserInfo ? detailedApproverUserInfo.firstName_lastName_regular : "N/A")} /> 
} 

{/* If form is submitted in the Submit mode from a non-Renew mode, redirect to /agreements with the Submit success message */}
{ (isFormSubmitted && submitValidationMode && props.mode !== 'renew')
  && 
    <Redirect to={"/agreements?result=submit&approver=" + encodeURIComponent(detailedApproverUserInfo ? detailedApproverUserInfo.firstName_lastName_regular : "N/A")} /> 
}

【问题讨论】：

嗨，下面的代码有任何更新吗？
不，这不是要走的路。如果我在 JS 中，我可以return，或者如果我在 JSX 中，我可以省略它。这方面无关紧要。重要的是重定向不会立即重定向。

标签： reactjs react-router

【解决方案1】：

放弃这个公认的答案： React Router v4 Redirecting on form submit 回来试试？

{/* If form is submitted in the Submit mode with the ChangeApprover scenario, redirect to /agreements with the Submit ChangeApprover success message */}
{ (isFormSubmitted && submitValidationMode && isChangeApprover) 
  &&
   return <Redirect to={"/agreements?result=submitChangeApprover&approver=" + encodeURIComponent(detailedApproverUserInfo ? detailedApproverUserInfo.firstName_lastName_regular : "N/A")} /> 
} 

{/* If form is submitted in the Submit mode from the Renew mode, redirect to /agreements with the Renew success message */}
{ (isFormSubmitted && submitValidationMode && props.mode === 'renew') 
  &&
   return <Redirect to={"/agreements?result=renew&approver=" + encodeURIComponent(detailedApproverUserInfo ? detailedApproverUserInfo.firstName_lastName_regular : "N/A")} /> 
} 

{/* If form is submitted in the Submit mode from a non-Renew mode, redirect to /agreements with the Submit success message */}
{ (isFormSubmitted && submitValidationMode && props.mode !== 'renew')
  && 
   return <Redirect to={"/agreements?result=submit&approver=" + encodeURIComponent(detailedApproverUserInfo ? detailedApproverUserInfo.firstName_lastName_regular : "N/A")} /> 
}

【讨论】：