I have the following flatlist render method that upon tapping on a list item, it will call the this._onPress method:
render() {
return (
<TouchableOpacity onPress={this._onPress} >
<View style={styles.bookItem} >
<Image style={styles.cover} source={{uri:this.props.coverURL}}/>
<View style={styles.info} >
<Text style={styles.title}>{this.props.title} </Text>
<Text style={styles.author}>{this.props.author}</Text>
<Text style={{height: 8}}/>
</View>
<View style={styles.rightIcon}>
<Icon name="chevron-right" size={28} color={'#AAAAAA'} />
</View>
</View>
</TouchableOpacity>
);
}
After I added the swipeout tag in the following code, the swipeout works but tapping on an item no longer calls the this._onPress method:
render() {
// Buttons
var swipeoutBtns = [
{
text: 'Delete',
onPress: this._buttonPress
}
]
return (
<TouchableOpacity onPress={this._onPress} >
<Swipeout right={swipeoutBtns} >
<View style={styles.bookItem} >
<Image style={styles.cover} source={{uri:this.props.coverURL}}/>
<View style={styles.info} >
<Text style={styles.title}>{this.props.title} </Text>
<Text style={styles.author}>{this.props.author}</Text>
<Text style={{height: 8}}/>
</View>
<View style={styles.rightIcon}>
<Icon name="chevron-right" size={28} color={'#AAAAAA'} />
</View>
</View>
</Swipeout>
</TouchableOpacity>
);
}
Is this a restriction of react-native-swipeout?
If you were to have Swipeout as the first tag and touchable as the next nested tag I think it would work. However, its seems to make the Swipeout functionality less responsive
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With