React native 当接触点在多个可接触元素之间移动时，如何跟踪当前接触的元素？

我有这样一个UI：

<Container>
  <Box id="a" />
  <Box id="b" />
  <Box id="c" />
</Container>
<Text>You are touching: {touchedBoxId}</Text>

我想在触摸不同元素时更新您正在触摸的

：文本。具体而言，我希望支持这种用法：


用一个手指按下容器中的任意点
将手指保持在屏幕上的同时，将手指移动到任意框
a/b/c
当手指触摸a/b/c

时，更新文本

将手指移动到另一个框中，然后再次更新文本

等等

我尝试将

onPressIn

处理程序添加到每个框中。这适用于攻丝单个盒子。但是，如果我在两个框之间移动手指，则不会调用其他框的

onPressIn

处理程序。换句话说，在另一个盒子观察到触摸事件之前，我必须抬起手指

我之前已经实现了这一点，将

PanResponder

处理程序添加到

Container

中，并根据移动事件的坐标确定要触摸哪个框。这种方法很麻烦，我假设有一种更简单的方法来实现所需的行为

如果重要的话，容器实际上是一个

react原生svg

svg

元素，而框

a/b/c

实际上是svg

Rect

元素

如何实现这一点？

使用onResponderMove（事件、手势状态），同时触摸svg元素

A

并将手指移动到元素

B

。我们可以直接处理元素

A

，但不能处理

B

。在

onResponderMove

中，使用

（event.nativeEvent.locationX>=B.x&&event.nativeEvent.locationX=B.y&&event.nativeEvent.locationY
 ______________
|container     |
|  __  __  __  |
| |a ||b ||c | | You are touching: a
| |__||__||__| |
|______________|