react hookリスニングウィンドウサイズ

学習hookは小さなdemoを使用します: 

import React,{useCallback,useState,useEffect} from 'react';

function ChangeSize(){
    const [size,setSize] = useState({
            width:document.documentElement.clientWidth,
            hieght:document.documentElement.clientHeight
    })

    const onResize = useCallback(()=>{
        setSize({
            width:document.documentElement.clientWidth,
            height:document.documentElement.clientHeight,
        })
    },[])

    useEffect(()=>{
        window.addEventListener('resize',onResize);
        return (()=>{
            window.removeEventListener('resize',onResize)
        })
    },[])

    return size;
}

 
 
次の操作を行います.

//            ChangeSize;
// let size  = ChangeSize();
//     size.width;//get width;
//     size.height;//get height;