React组件卸载、路由跳转、页面关闭（刷新）之前进行提示

React组件卸载生命周期、路由跳转和页面关闭三者看起来有些类似的地方，比如都是当前组件即将从视口消失，但实际上所触发的事件均不相同。以一个实际案例出发：

某单页应用的 文章编辑页用户正在编辑文章，此时尚未保存。

当用户不小心要跳转到另外一个路由时需要提醒用户是否继续跳转，这个过程需要触发路由跳转以及组件卸载；

而用户不小心点了关闭标签页按钮，或刷新了页面。这个过程触发了页面卸载事件；

在这个案例中我们需要实现：

1. 用户跳转页面时弹出提示框（路由采用histroy模式）

2. 用户关闭页面时弹出提示框

componentWillUnmount

首先这个钩子函数是在组件卸载前调用的一个函数，它并不能阻止当前组件的卸载。所以不要想方设法在这里做提示，因为即便提示了，组件还是会卸载，文章还是会消失。

路由守卫-<Prompt/>

为了实现第一个功能，需要一个跳转路由之前进行的判断。在react-router-dom 4.0 之后取消了先前的路由守卫（其实我没研究过之前版本的，这个描述摘自网络）。在react-router-dom 4.0之后，实现这个功能可以依靠<Prompt/>组件。