rajsuvariya / autocompletetextview

2 stars 5 forks source link

showDropDown does not work with controlled component #11

Open Noitidart opened 6 years ago

Noitidart commented 6 years ago

If we run the code below. As it is a controlled component. On mount, the drop down does not show.

I think this is a low priority bug. Maybe we should even remove "showDropDown", because if the user wants to show dropdown, they can just get a ref to the input, and do input.focus(). (oh wait i dont know if we support ref.focus() yet)

import React, { Component } from 'react'
import { StyleSheet, Text, View } from 'react-native'
import { AutoCompleteTextView } from 'autocompletetextview'

export default class App extends Component {
    state = {
        value: ''
    }

    suggestions = ['Bangalore', 'Pune', 'Delhi', 'Goa']

    render() {
        return (
            <View style={styles.container}>
                <AutoCompleteTextView
                    style={styles.inputView}
                    dataSource={this.suggestions}
                    onTextChange={this.handleTextChange}
                    hint="Your Hint"
                    value={this.state.value}
                    showDropDown
                />
            </View>
        )
    }

    handleTextChange = text => this.setState(() => ({ value:text }))
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    },
    inputView: {
        height: 60,
        width: 200,
        backgroundColor: 'skyblue'
    }
});