我正在渲染一个项目列表，如下所示：

{formattedJournal[meal].map((food, idx, arr) => {
                const isLast = idx === arr.length - 1;
                return (
                  <View key={idx}>
                    <JournalItem
                      isLast={isLast}
                      idx={idx}
                      food={food}
                    />
                  </View>
                );
              })}

// JournalItem.js
  
const translateX = useRef(new Animated.Value(0)).current || 0;
  handleDelete = (food) => {
    Animated.timing(translateX, {
      toValue: -width,
      duration: 350,
      useNativeDriver: false,
    }).start(() => null);
  };

return (<Swipeable
        renderRightActions={renderRightActions}
        overshootRight={false}
        onSwipeableOpen={() => handleDelete(food)}
        rightThreshold={75}
        containerStyle={[
          {
            transform: [{ translateX }],
          },
        ]}
      > ... )

字符串
我想做的很简单，我想在用户滑动的时候删除一个项目。相反，发生的事情是，列表中的 last 项目接收动画，不管你触发了哪个元素上的滑动，这没有意义，因为每个useRef调用都被限制在它自己的JournalItem示例中，所以我不知道为什么它在滑动时只使用最后一个引用。