reactjs - autoFocus でネイティブの Multiple TextInput に反応する

Question

「react-native-paper」の TextInput コンポーネントで「autoFocus」プロパティを使用すると問題が発生します。

私のコンポーネントでは、複数のステップを表示する必要があり (ステップごとに 1 つの入力があります)、すべてのステップで適切な入力にオートフォーカスする必要があります。

私の render() 関数:

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>
    );
}

私が持っているすべてのdisplayStep（）で：

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

そして、最初のステップだけが正しくオートフォーカスされ、他のステップはランダムにオートフォーカスされます...

私のsubmitStep1機能：

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});
};

TextInput ごとに状態「autoFocus」を渡そうとしましたが、次のステップに渡すときに値を変更しましたが、機能しません。

私は少し混乱しています...マルチステップコンポーネントで間違っているのでしょうか?