在本机反应中基于互联网连接运行功能答案

【问题标题】：run function on bases of internet connectivity in react native在本机反应中基于互联网连接运行功能
【发布时间】：2021-08-03 00:27:45
【问题描述】：

我正在开发 React Native 应用程序，我使用 firebase 作为后端。我从 firebase 实时数据库中获取数据并将其呈现在页面上。但现在我希望我的应用程序能够离线支持。

我使用以下两个函数进行渲染。对于来自数据库的列表

  const loadListings = () => {
    let data = [];
    listingRef.orderByChild("created_at").on("value", (snapshot) => {
      data = [];
      snapshot.forEach((listing) => {
        data.push(listing.val());
      });
      cache.store("listings", data.slice(0, 10)); // only stores latest ten listings
      setListings(data);
      setLoading(false);
    });
  };

然后在useEffect里面使用就好了。

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

对于缓存中的列表，我使用了这个。

  const loadListingsCached = async () => {
    let data = await cache.get("listings");
    setListings(data);
  };

现在我不能在 firs 函数中进行检查，因为效果挂钩只会运行一次，并且初始网络状态为空。它没有定义。我该如何做到这一点？顺便link to package I used for detecting connectivity

编辑我将此钩子用作 useEffect() 的第二个参数，但对我不起作用

  const netInfo = useNetInfo();

我

【问题讨论】：

this 回答你的问题了吗？
我试过了，还是不行

标签： firebase react-native firebase-realtime-database use-effect offline-caching

【解决方案1】：

您想要实现的是根据网络状态使代码不同。在@Rohit 链接的答案中，有关于如何使用 Net Info Package 检查网络连接的答案。

你要做的就是让效果依赖于状态的变化。您应该将其作为参数传递给效果。

 const netInfo = useNetInfo();
 useEffect(() => {
   loadListings();
 }, [netInfo]);

这样，当检测到网络更改时，代码将始终运行。我希望这是你想要达到的。请更具体地说明您的目标以及问题所在。当前的问题没有指定钩子是否不起作用，或者渲染功能没有触发等。

【讨论】：