javascript - React Native 样式表在刷新之前不起作用

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

我在我的主要组件中这样使用它（用于演示目的的硬编码显示属性）：

<BlurryWait show={true}/>

预计将文本在屏幕中间居中。但是，当我切换该变量时，它会弄乱样式，文本不再居中。

为了让它再次工作，我必须改变一些样式，它会再次工作。比如只要改变文字大小就可以了。我不知道这里发生了什么。我已经清理了 android 版本。我怎样才能让它坚持风格？