如果用户移出某个区域，我如何渲染组件？答案

【问题标题】：How can I render a component if a user moves out of a region?如果用户移出某个区域，我如何渲染组件？
【发布时间】：2022-06-10 22:47:38
【问题描述】：

我正在开发一个带有 react native 和 react-native-maps 的应用程序，我只想在用户离开美国地区时呈现一个组件。我不清楚我该怎么做，我怎么知道当前区域是否不再在特定的半径/范围内，即：

if (region !== USARegion) {
  return <MyComponent />
}

【问题讨论】：

【解决方案1】：

只是简单地解释一下你将如何做到这一点：

您需要使用监听器来监控用户的坐标，我使用了 expo location

获取坐标使用：

import * as Location from 'expo-location';
let location = await Location.getCurrentPositionAsync({});

那么在你的 useEffect 中你需要监听这些位置的变化

  useEffect(() => {

//other functions here

  },[location])

注意：您可能需要将这些位置存储在某处以跟踪更改。我建议使用 firebase 实时数据库

然后根据您收集的坐标获取实际区域，我建议使用此 API：http://www.geonames.org/

它相当轻巧且易于使用。

获得新区域后，您可以运行上面的 if 语句来检查该区域是否不是美国

【讨论】：