如何防止在React组件中卸载？

Question

我试图在我的应用中实现一项功能，当用户尝试从未提交的表单导航时，他们会得到一个确认，询问他们是否确定要在保存更改前离开。

的componentWillUnmount方法似乎是这样，因为它会火为所有用户可以抛弃形式的各种方法完美的候选人（改变，导致它消失父组件状态，导航到不同的路线，等...）。但是...当确认返回错误时，我无法阻止卸载。

关于如何实现这一点的任何建议？

Answer 1

这最好通过react-router：setRouteLeaveHook来处理。

componentWillMount() { 
    this.unregisterLeaveHook = props.router.setRouteLeaveHook(props.route, this.routerWillLeave.bind(this)); 
} 

routerWillLeave(nextLocation) { 
    return false;   
} 

当组件卸载，注销假钩：

componentWillUnmount() { 
    this.unregisterLeaveHook(); 
} 

Answer 2

我不会推荐在componentWillUnmount中这样做。我通常希望在商店中做到这一点（如果您使用的是流量架构）。通常需要跟踪所有数据的商店。 componentWillUnmount函数是你想要卸载存储监听器的。