React useEffect

useEffect自带生命周期

useEffect的第二个参数表示 有值变动才执行

 useEffect(() => {
 		// 初始化
        console.log('init effect');
      
        const callBack = (e: MouseEvent) => {
            console.log('调用的次数');
            // 调用
            setPos({
                x: e.clientX,
                y: e.clientY
            })
        };
          // 增加监听回调
        document.addEventListener('click', callBack)
        
        return () => {
            console.log('remove effect');
            // 清除监听回调
            document.removeEventListener('click', callBack);
        }
    }, [pos.x]);
    
    执行的顺序是: 
    1、 init effect 2、调用的次数 3、remove effect 4、init effect
	
    多用就好