javascript - React ネイティブ スタイルシートが更新されるまで機能しない

Question

私のコンポーネントには<Text>内にがあり<BlurView>ます。

import React from "react";
import { Text, View, StyleSheet} from "react-native";
import { BlurView } from "@react-native-community/blur";

const styles = StyleSheet.create({
    blurView: {
        position: "absolute",
        top: 0,
        left: 0,
        bottom: 0,
        right: 0,
        display: "flex",
        justifyContent: "center",
    },
    text: {
        fontSize: 22, 
        color: "#FFFFFF", 
        textAlign: "center"
    }
})

function BlurryWait({show}){
    if(show)
        return (
            <BlurView
                blurType="dark"
                blurAmount={15}
                style={styles.blurView}
            >   
                <Text style={styles.text}>Please wait...</Text> 

            </BlurView>       
        )
    else
        return <View/>
}

export default BlurryWait

そして、メイン コンポーネントで次のように使用します (デモンストレーションのためにハードコードされた showプロパティ)。

<BlurryWait show={true}/>

画面の真ん中にテキストを中央に配置することが期待されています。ただし、その変数を切り替えると、スタイルが台無しになり、テキストが中央に配置されなくなります。

再び機能させるには、スタイルで何かを変更する必要があり、再び機能します。テキストサイズを変更するだけで正しくなります。ここで何が起こっているのかわかりません。私はすでにアンドロイドビルドをきれいにしました。これをスタイルに合わせるにはどうすればよいですか？