朋友,我将采用一个“父母视图”,而在视图内部则采用一个“ TouchableOpacity”。我将在主视图上添加panResponder,当触摸主视图时,它可以正常工作。但是TouchableOpacity无法正常工作,我想删除TouchableOpacity上的panResponder。这样TouchableOpacity就可以了。
代码:
this._panResponder = PanResponder.create({
// Ask to be the responder:
onStartShouldSetPanResponder: (evt, gestureState) => true,
onStartShouldSetPanResponderCapture: (evt, gestureState) => true,
onMoveShouldSetPanResponder: (evt, gestureState) => true,
onMoveShouldSetPanResponderCapture: (evt, gestureState) => true,
onPanResponderGrant: (evt, gestureState) => {
// The gesture has started. Show visual feedback so the user knows
// what is happening!
// gestureState.d{x,y} will be set to zero now
// this.toggleModal()
},
onPanResponderMove: (evt, gestureState) => {
// The most recent move distance is gestureState.move{X,Y}
// The accumulated gesture distance since becoming responder is
// gestureState.d{x,y}
console.log('onPanResponderMove');
},
onPanResponderTerminationRequest: (evt, gestureState) => true,
onPanResponderRelease: (evt, gestureState) => {
// The user has released all touches while this view is the
// responder. This typically means a gesture has succeeded
console.log('onPanResponderRelease');
this.toggleModal()
},
onPanResponderTerminate: (evt, gestureState) => {
// Another component has become the responder, so this gesture
// should be cancelled
console.log('onPanResponderTerminate');
},
onShouldBlockNativeResponder: (evt, gestureState) => {
// Returns whether this component should block native components from becoming the JS
// responder. Returns true by default. Is currently only supported on android.
console.log('onShouldBlockNativeResponder');
return true;
},
});
}
在家长视图中添加了Pan:
render() {
return (
<View {...this._panResponder.panHandlers}>
<TouchableOpacity onPress={this._onPressButton}>
<Image
style={styles.button}
source={require('./myButton.png')}
/>
</TouchableOpacity>
</View>
);
},
在mainView上添加Pan时,Button OnPress事件不起作用。
最佳答案
更改此行,然后内部Touchables
将获得事件。
当返回true时,它将防止孩子成为响应者。
onStartShouldSetPanResponderCapture: (evt, gestureState) => false,
从document:
因此,如果父视图希望阻止孩子成为响应者
在触摸开始时,它应该具有onStartShouldSetResponderCapture
返回true的处理程序。
关于reactjs - 如何在子组件上禁用PanResponder-React Native,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/45810262/