Day 18 - custom hook

如果有错误，欢迎留言指教~ Q_Q 还没写完辣

除了用 React 帮你定义的 Hook

你也可以创造自己的 Hook

当你发现有可以共享的逻辑时，就可以把他再拉出来

不然就放在 component

而命名开头也是应该是为 use ，例如: useTabs

Custom Hook 的回传，就像是 usestate 一样可以是 [], {}, string ...

import { useState, useEffect } from 'react';

function useFriendStatus(friendID) {
  const [isOnline, setIsOnline] = useState(null);

  useEffect(() => {
    function handleStatusChange(status) {
      setIsOnline(status.isOnline);
    }

    ChatAPI.subscribeToFriendStatus(friendID, handleStatusChange);
    return () => {
      ChatAPI.unsubscribeFromFriendStatus(friendID, handleStatusChange);
    };
  });

  return isOnline;
}

ref:

1. https://zh-hant.reactjs.org/docs/hooks-custom.html