Question

我正在尝试构建一个自定义钩子以获取数据。

这是我的 App.js ：

const [loadData, mainCategories] = useCustomHook();

  useEffect(() => {
    loadData();
  }, []);

  return (
    <FlatList
      data={mainCategories}
      renderItem={({ item }) => {
        return (
          <View>
            <Text>{item.name}</Text>
          </View>
        );
      }}
    />
  );
};

这是我的 useCustomHook.js ：

const useCats = () => {
  const [mainCategories, setMainCategories] = useState();

  const loadData = async () => {
    let response = await fetch(
      `URL/read.php`
    );
    let results = await response.json();
    setMainCategories(results.data);
  };

  return [loadData, mainCategories];
};

export default useCustomHook;

工作正常。我要从我的 useCustomHook.js 中返回并导出loadData和mainCategories，并且在 App.js 中都使用它们

现在是我苦苦挣扎的部分：

假设我需要 useCustomHook.js 中的 App.js 中的常量。就我而言，我在 App.js 中获得了一个ID（从上一屏幕通过react-navigation转发），该ID是我在URL中所需的，例如：

URL/read.php?id=${id}

有什么方法可以在 useCustomHook.js 中获取该ID？

Answer 1

您可以将其作为参数传递。请尝试以下

const useCats = () => {
  const [mainCategories, setMainCategories] = useState();

  const loadData = async (id) => {
    let response = await fetch(
      `URL/read.php?id=${id} `
    );
    let results = await response.json();
    setMainCategories(results.data);
  };

  return [loadData, mainCategories];
};

如何在自定义钩子中从一个组件与另一个组件共享常量

1 个答案: