在执行onClick操作之前(按特定按钮时),请防止向上导航

时间:2019-06-07 14:45:34

标签: javascript reactjs react-router jsx

我正在使用Prompt中的react-router,并且需要一些有关如何设计when={true}方面的建议。

从逻辑上讲,我想发生的事情是Prompt阻止导航when组件可见(通过将其放置在相关组件中,该部分就可以了)直到按下了激活onClick事件onComplete的按钮。

这将使我的问题特别明确,在执行onComplete之前是否可以返回false?如果不是,那么在这里还有什么意义呢?

最终,我正在寻找一种解决方案,使用户可以浏览表单,但是会询问他们是否确定要离开现有页面,直到点击“提交”(应该如果他们想离开,则不提示他们-它应该只处理他们的请求)。我希望这是有道理的。

以前,我已将Prompt设置为可以激活,只要所有步骤都未经验证-但是在用户完成最后一步之后,在点击“提交”之前,他们可以导航而无需提示。看起来像这样:

const shouldPreventNavigation = useMemo(() => areAllStepsValidated(steps), [steps]);

...
...

<Prompt when={!shouldPreventNavigation} message="Are you sure? Your changes will not be saved." />

任何帮助将不胜感激!

0 个答案:

没有答案