标签:ini imp 信息 idm turn import col react out
React不像Vue那样有router.beforeEach这样的路由钩子,但是它提供了一个组件:Prompt
import { Prompt } from ‘react-router-dom‘; <Prompt when={true} message={location => ‘信息还没保存,确定离开吗?‘} />
在React跳转路由的时候,Prompt就会触发
但是这个路由没法阻止刷新和关闭,这个时候我们用beforeunload事件
class Test extends React.Component { componentDidMount() { this.init(); window.addEventListener(‘beforeunload‘, this.beforeunload); } componentWillUnmount = () => { window.removeEventListener(‘beforeunload‘, this.beforeunload); }; beforeunload = (ev: any) => { if (ev) { ev.returnValue = ‘‘; } }; render() { return <div>...</div> } }
标签:ini imp 信息 idm turn import col react out
原文地址:https://www.cnblogs.com/amiezhang/p/13207409.html