useState
useEffect
useEffect可以直接讀取組件內(nèi)的state陆蟆，并且默認(rèn)情況下每次渲染的時候都會執(zhí)行。（因為也可以跳過它）
清除effect(可選)
清除effect不需要單獨寫一個清除的程序，userEffect設(shè)計了一種方式：如果useEffect返回一個函數(shù)秽荞， react將會在該函數(shù)內(nèi)執(zhí)行清除工作
useEffect(() => {
function handleStatusChange(status) {
setIsOnline(status.isOnline);
}
ChatAPI.subscribeToFriendStatus(props.friend.id, handleStatusChange);
// Specify how to clean up after this effect:
return function cleanup() { // 也可以返回一個箭頭函數(shù)或者給起一個別的名字
ChatAPI.unsubscribeFromFriendStatus(props.friend.id, handleStatusChange);
};
});
跳過 Effect 進(jìn)行性能優(yōu)化
effect 在每次渲染后都會執(zhí)行清理或者執(zhí)行 effect萤衰，這 可能會導(dǎo)致性能問題。在useEffect內(nèi)置的API中坏瞄，如果state值在兩次渲染中沒有任何變化桂对，就可以設(shè)置useEffect的第二個參數(shù)來判斷需不需要調(diào)用useEffect，以此來達(dá)到性能優(yōu)化的目的鸠匀。
// 官方案例
useEffect(() => {
document.title = `You clicked ${count} times`;
}, [count]); // 僅在 count 更改時更新
Hook的兩條規(guī)則
只在最頂層使用 Hook
不要在循環(huán)蕉斜，條件或嵌套函數(shù)中調(diào)用 Hook， 確弊汗鳎總是在你的 React 函數(shù)的最頂層調(diào)用他們宅此。
