React native Multiple TextInput with autoFocus

Question

I'm having a problem using the "autoFocus" property on a TextInput component, from 'react-native-paper'.

In my component i have to display multiple steps (there is one input per step), and every step i have to auto focus the good input.

My render() function :

render() {
    let step;

    switch (this.state.step) {
        case 1:
            step = this.displayStep1();
            break;
        case 2:
            step = this.displayStep2();
            break;
        case 3:
            step = this.displayStep3();
            break;
        default:
            step = this.displayStep1();
    }

    return (
        <KeyboardAvoidingView
            behavior={Platform.OS === 'ios' ? 'padding' : null}
            style={{flex: 1}}>
            <SafeAreaView style={styles.container}>
                <ScrollView style={{padding:10}}>
                <Spinner visible={this.state.loading} textContent={''} />
                    {this.state.error === '' ? null :  <HelperText type="error" visible={this.state.error}>{this.state.error}</HelperText>}
                    {step}
                </ScrollView>
            </SafeAreaView>
        </KeyboardAvoidingView>
    );
}

In every displayStep() I have :

<TextInput
 label="Article"
 value={this.state.article}
 onChangeText={article => this.setState({article})}
 onSubmitEditing={this.submitStep1}
 autoFocus
 blurOnSubmit={false}
 style={{backgroundColor: 'transparent'}}
            />

And only the first step is autoFocused correctly, the others are randomly autofocused...

My submitStep1 function :

submitStep1 = async () => {
    this.setState({error: '', loading: true});
        let data = await this.ws.getInfosArticle(this.state.menu,this.state.article, this.state.fournisseur, "");
        let infos = data.ProDataSet.Infos;

        if (infos && infos.length > 0) {

            Keyboard.dismiss();

            let result = this._getTypInfos(infos);

            if (result === true) {

                this.setState({vfocus: data.ProDataSet.ab_unmap.vfocus});

                //Si le produit à des déclinaisons, on passe sur le choix de la déclinaison
                if( this.state.declinaisons.length > 0 ) {
                    this.setState({declinaison : this.state.declinaisons[0], step: 2});
                } else {
                    //Si on arrive ici c'est que le produit a été trouvé, on peut passer à la STEP 2 avec les infos produits.
                    let details = await this.ws.getDetailsInfosArticle(this.state.menu,this.state.article,"");
                    this._formatDecimals(details.ProDataSet);
                    this.setState({step : 3});
                }
            }
        } else {
            this.setState({error: "Article non trouvé"});
        }

    this.setState({loading: false});
};

I tried to pass a state "autoFocus" for each TextInput and changing the value when i pass to the next step, it doesn't works.

I'm a bit confused... Maybe am I doing it wrong with the multi-step component ?