如何在 reducer 或自定义函数中使用 netinfo

Question

我正在使用 react-native、expo 和 redux 制作一个离线优先的应用程序，我需要根据互联网连接将用户更改发送回服务器，所以我正在使用 expo-background-fetch使用自定义函数定期完成此任务或调度一些使用 netInfo 检查互联网连接的操作作为完成工作的条件，但它不起作用，因为总是说“错误：无效挂钩调用。挂钩只能在 reducer 或自定义函数中在函数组件的主体内部调用。

import * as BackgroundFetch from 'expo-background-fetch';
import * as TaskManager from 'expo-task-manager';
import {sync} from './sync';
const BACKGROUND_FETCH_TASK = 'background-fetch';

TaskManager.defineTask(BACKGROUND_FETCH_TASK, async () => {
    const now = Date.now();
  
    console.log(`Got background fetch call at date: ${new Date(now).toISOString()}`);
    sync();
    // Be sure to return the successful result type!
    return BackgroundFetch.BackgroundFetchResult.NewData;
});

async function registerBackgroundFetchAsync() {
    console.log('registered');
    return BackgroundFetch.registerTaskAsync(BACKGROUND_FETCH_TASK, {
      minimumInterval: 1, // 15 minutes
      stopOnTerminate: false, // android only,
      startOnBoot: true, // android only
    });
}

这是在全局范围内的 App.js 文件中，然后在我使用 await registerBackgroundFetchAsync() 注册任务的组件上；我的 sync.js 文件如下所示：

import {useNetInfo} from "@react-native-community/netinfo";

export function sync () {
    const netInfo = useNetInfo();
}

任何解决方案或解决方法？

Answer 1

您似乎不应该在 defineTask 回调中调用 sync。 useNetInfo 意味着从 React 函数组件中调用。您可以使用其他不是钩子的方法。 https://github.com/react-native-netinfo/react-native-netinfo#fetch 可能是你的朋友。

如何在 reducer 或自定义函数中使用 netinfo

how to use netinfo inside reducer or custom function

react-native

redux

react-native-community-netinfo