react自定义hook

React 自定义 Hook 是一种用于共享逻辑的方式，它可以将组件之间共享的状态逻辑抽离出来，实现代码复用。使用自定义 Hook，可以将组件中相互关联的部分拆分成更小的函数，让逻辑清晰、易于维护和测试。

自定义 Hook 是一个以 `use` 开头命名的函数，它可以在其中使用 React 内置的 Hook 或者其他自定义 Hook。自定义 Hook 返回的值可以是任意类型的数据，一般包含状态和操作状态的方法。

下面是一个自定义 Hook 的示例：

import { useState, useEffect } from 'react';

function useFetch(url) {
  const [data, setData] = useState(null);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);

  useEffect(() => {
    async function fetchData() {
      try {
        const response = await fetch(url);
        const json = await response.json();
        setData(json);
      } catch (e) {
        setError(e);
      } finally {
        setLoading(false);
      }
    }

    fetchData();
  }, [url]);

  return { data, loading, error };
}

这个自定义 Hook 实现了一个从远程 API 获取数据的功能，它返回了一个包含 `data`、`loading` 和 `error` 的对象。在组件中使用这个自定义 Hook 可以实现数据获取和状态管理的复用。