TouchableHighlight with custom component
Usually in React Native when you want to add touch events to a custom component you just wrap it with a Touchable*
component.
If you want to use TouchableOpacity
there is no need to change anything on the custom component, but if you want to use TouchableHighlight
you have to change the component and implement setNativeProps
and delegate to the container View
:
class CustomComponent extends Component {
render() {
return (
<View ref='container'>
...
</View>
)
}
setNativeProps(nativeProps) {
this.refs.container.setNativeProps(nativeProps);
}
}
And then you are ready to go:
<TouchableHighlight onPress={this._onPress} underlayColor="#fc0">
<CustomComponent />
</TouchableHighlight>
Tweet