Event-native-svg onPress событие не работает

Question

Я работаю с response-native-svg, так как в документации сказано, что можно вызвать событие onPress для элементов svg, но это не работает.

<Svg width={370} height={180} {...props} viewBox="0 0 385 185" >
   <Path
      d="M5.607 13.536l9.267 9.267a2.5 2.5 0 0 1-3.535 3.536L.732 15.732a2.497 2.497 0 0 1-.695-2.196 2.497 2.497 0 0 1 .695-2.197L11.34.732a2.5 2.5 0 0 1 3.535 3.536l-9.267 9.268z"
      fill="white"
      onPress={() => alert('Press on Circle')}
    />
</Svg>

Затем я попробовал пример, написанный в документации:

<Svg
            height="100"
            width="100"
        >
    <Circle
    cx="50%"
    cy="50%"
    r="38%"
    fill="red"
    onPress={() => alert('Press on Circle')}
/>
  </Svg>

Но как первый он не работает

Answer 1

Проблема была вызвана panResponder, поскольку он имел более высокий приоритет, чем кнопка, поэтому решение состоит в том, чтобы не всегда возвращать true из onMoveShouldSetPanResponderCapture. например:

componentWillMount() {
        this.panResponder = PanResponder.create({
            onMoveShouldSetPanResponderCapture: this.onShouldDrag,
            onPanResponderMove: Animated.event(
            [null, { dx: this.state.pan.x }]
            ),
            onPanResponderRelease: this.onReleaseItem,
            onPanResponderTerminate: this.onReleaseItem,
        });
    }

    onShouldDrag = (e, gesture) => {
        const { dx } = gesture;
        return Math.abs(dx) > 2;
    }