1.未使用useMemo组件的state更新后，计算的一些数据也会重新经常计算
例子：页面一个根据count计算显示的总数，另外一个功能是切换页面主题，当页面切换主题改变state的时候，总数会去重新计算，造成页面卡顿
const [colors, setColors] = useState(true);
const [count, setCount] = useState(1);
const clickFn = () => {
let sum = 0;
for (let i = 0; i < 1000000000*count; i++) {
sum += i;
}
return sum;
};
<div>获得总数{clickFn()}</div>
<div onClick={() => { setCount(count+1);}}>改变count</div>
<div onClick={() => { setColors(!colors);}}>点我换主题{colors == true ? 'red': 'black'}</div>
2.使用useMemo，当依赖的count发生改变才去重新计算，return值出来，这时候切换主题页面就不卡顿了
const clickFn = useMemo(() => {
let sum = 0;
for (let i = 0; i < 100000000*count; i++) {
sum += i;
}
return sum;
},[count]);
<div>获得总数{clickFn}</div>
3.注意usememo 是return一个值出来，和useEffect不一样
