reacthooks-怎么写一个离开弹窗提醒

#1

目前还没有搜索到相关说法。
useEffect没办法读取state的变化;

const Detail = () => {
    const history = useHistory();
    const [varA, setA] = useState(false);
    const jump = () => {
        history.push('/list');
    }
    useEffect(()=>{
        return () =>{
            if (varA) { // varA一直是false
                alert(123);
            }
        }
    },[]);
    return (
        <div>
            <input value={varA}/>
            <div onClick={()=>{jump()}}>jump</div>
            <div onClick={()=>{setA(!varA)}}>setA--{varA}</div>
        </div>
        
    )
}
#2

const [varA, setA] = useState(false);
const ref = React.useRef(varA);
ref.current = varA;
useEffect(()=> ()=> { alert(ref.current) }, [])

#3

这个应该改事件监听吧。。。。window onbeforeunload了解下。

不过这个有点坑,不能自定义样式,只能文案之类的,兼容性也。。。