Arthur
Arthur

Reputation: 3942

TouchableOpacity in ListView requires 2 clicks for onPress

I have a TextInput that will render a ListView prompting text to AutoComplete however the TouchableOpacity requires 2 clicks to trigger (first to dismiss the keyboard)

Adding keyboardShouldPersistTaps="always" to the ListView does not fix the problem.

Code:

render() {
    const { selected, searched } = this.state;
    return (
        <View>
            <TextInput
                onChangeText={this.searchedText}
                underlineColorAndroid="transparent"
                onBlur={this.blurInput}
            />
            <ListView
                keyboardShouldPersistTaps="handled"
                style={styles.autoCompleteListView}
                dataSource={ds.cloneWithRows(searched)}
                renderRow={this.renderRow.bind(this)}
            />
        </View>
    );
}

...

renderRow = (rowData) => (
    <TouchableOpacity
        onPress={this._onPressRow.bind(this, rowData)}
    >
        <Text>{ rowData }</Text>
    </TouchableOpacity>
);

Upvotes: 3

Views: 399

Answers (1)

ageoff
ageoff

Reputation: 2828

https://github.com/facebook/react-native/issues/10138#issuecomment-304344283

All nested components need the keyboardShouldPersistTaps property

Upvotes: 3

Related Questions