Focus Picker component on react native

Question

I have a Picker component as a part of a form on react native.
I want to focus the picker when the user click on the submit button on the keyboard just as I can focus the other text inputs, using the component's props:

onSubmitEditing={() => {this.nextTextInput.focus()}}
ref={ref => {this.thisTextInput = ref}}

Is this possible?
What picker method should I use?
It is ok if the picker open the popup on the focus event.

Thanks in advance!

Answer 1

In the same way you can focus your components like this;

constructor(props) {
    super(props);
    this.picker = React.createRef();
    this.focusPicker = this.focusPicker.bind(this);
}

focusPicker() {
    this.picker.current.focus();
}

render() {
    return (
        <View>
            <Picker ref={this.picker}>
            ........
            </Picker>
            <TouchableOpacity onPress={this.focusPicker}/>
        </View>
    );
}

Answer 2

Another late answer in the block. :) if you're getting "_this.picker.current.focus is not a function" error; Try: pickerRef.current.wrappedInstance.focus()

i.e

...
const pickerRef = useRef();
    
<Picker
    ref={pickerRef}
    mode="dropdown"
    >
        <Picker.Item label="" value="" />
</Picker>


<Pressable
    onPress={() => {
        pickerRef.current.wrappedInstance.focus();
    }}>
    <Text>Click Me!!</Text>
</Pressable>