我正在努力做到这一点
头
headerRight
不工作,只有headerLeft
和headerTitle
工作
import Icon from 'react-native-vector-icons/MaterialIcons';
<HomeStack.Navigator
screenOptions={{headerStyle: {elevation: 0, shadowOpacity: 0}}}>
<HomeStack.Screen
name={NAVIGATOR.ProviderTypeTab}
component={ProviderTypeStack}
options={{
title: null,
headerLeft: () => (
<View style={{marginTop: 10, marginLeft: 10}}>
<ProfilePicComponent onPress={handleDrawer} />
</View>
),
headerRight: () => {
<View style={{height: 10, width: 10, backgroundColor: 'red'}}>
{/* <Icon name="location-on" size={24} /> */} //headerRight doesn't work
</View>;
},
headerTitle: () => (
<View style={{width: '85%', marginTop: 10}}>
<SearchInputComponent onPress={handleDrawer} />
</View>
),
}}
/>
</HomeStack.Navigator>
headerRight和headerLeft是一样的,但是你没有从你为headerRight提供的函数中返回任何东西
改变headerRight: () => {
<View style={{height: 10, width: 10, backgroundColor: 'red'}}>
{/* <Icon name="location-on" size={24} /> */} //headerRight doesn't work
</View>;
},
headerRight: () => (
<View style={{height: 10, width: 10, backgroundColor: 'red'}}>
{/* <Icon name="location-on" size={24} /> */} //headerRight doesn't work
</View>;
),
或
headerRight: () => {
return (<View style={{height: 10, width: 10, backgroundColor: 'red'}}>
{/* <Icon name="location-on" size={24} /> */} //headerRight doesn't work
</View>);
},