我想使用 useLayoutEffect 制作自定义标头,但它对我不起作用。如果有人能帮忙那就太好了。
useLayoutEffect(() => {
navigation.setOptions({
headerTitle: "Hello",
headerStyle: {
backgroundColor: "#00CED1",
},
headerLeft: () => (
<Image
style={{ width: 140, height: 120, resizeMode: "contain" }}
source={{
uri: "https://assets.stickpng.com/thumbs/580b57fcd9996e24bc43c518.png",
}}
/>
),
headerRight: () => (
<View
style={{
flexDirection: "row",
alignItems: "center",
gap: 6,
marginRight: 12,
}}
>
<Ionicons name="notifications-outline" size={24} color="black" />
<AntDesign name="search1" size={24} color="black" />
</View>
),
});
}, []);
return (
<ScrollView style={{ padding: 10, flex: 1, backgroundColor: "white" }}>
<Text style={{ fontSize: 16, fontWeight: "bold" }}>
Welcome Sanju
</Text>
</ScrollView>
)
}
以上代码未显示自定义标头。只显示“欢迎三州”。 预先感谢
请确保
headerShown: true
进入您的 Stack.Screen。