useEffect

code:useEffect.tsx

useEffect(() => {

// side effects

ChatAPI.subscribeToFriendStatus(props.friend.id, handleStatusChange);

// Specify how to clean up after this effect:

// React performs the cleanup when the component unmounts.

return function cleanup() {

ChatAPI.unsubscribeFromFriendStatus(props.friend.id, handleStatusChange);

};

});

「renderの後」になにかを行いたいときに使う

React は、副作用が実行される時点では DOM が正しく更新され終わっていることを保証します

ここに定義した関数はrenderの後に毎回呼ばれる

componentDidMount と componentDidUpdate と componentWillUnmount がまとまったものだと考えることができます