Question

React Native的新手，我正在尝试实现一个自定义钩子来进行API调用（天气API）。如果设备离线，则挂机应重试呼叫。我正在使用Axios和Netinfo挂钩。

api / weather.js

export default function useWeather() {
  const [{ getData }, executeGet] = useAxios(
    WEATHER_URL, { manual: true }
  );
  const netInfo = useNetInfo();
  const [requestPending, setRequestPending] = React.useState(false);

  function getWeather() {
    executeGet();
    setRequestPending(true);
  }

  React.useEffect(() => {
    if (requestPending) {
      if (netInfo.isConnected) {
        setRequestPending(false);
      } else {
        const id = setInterval(executeGet, 1000);
        return () => clearInterval(id);
      }
    }
  }, [requestPending, netInfo, executeGet]);

  return [getData, getWeather];
}

然后，在App.js中

  const [getData, getWeather] = useWeather();

    return (
      <SafeAreaView>
        <Button
          onPress={getWeather}
          title="Click"
        />
        <Text>{JSON.stringify(getData)}</Text>
      </SafeAreaView>
    );

问题不起作用

注意

使用Expo 3.17.24进行构建
我注意到Axios提供了拦截器，但我尝试将Hooks用作可能。

问题

这是个好方法吗？
关于我的效果的deps数组，我不确定是否应指定executeGet

欢迎任何反馈：）

反应本机-自定义钩子useAxios与useNetInfo

0 个答案: