问题
I am trying to add a search icon next to the menu icon on my header on the right side. I have tried repeating Icon.Button
but there is no change. Using React Navigation, React Native Paper, and react-native-vector-icons/Iconicons.
<HomeStack.Navigator
screenOptions={{
headerStyle: {
backgroundColor: '#155888'
},
headerTintColor: '#fff',
headerTitleAlign: 'center',
headerRight: () => (
<Icon.Button
name='ios-menu'
size={30}
backgroundColor='#155888'
style={{ flexDirection:"row", paddingRight: 15 }}
onPress={() => { navigation.toggleDrawer() }}
/>
)
}}
>
回答1:
I think custom-header will solve your problem.
I have also faced that issue, what I did I just added to custom-header each screen ( by using helper method )
export const createAppHeader = (props, callback, data) => {
props.navigation.setOptions({
headerRight: () => (
<AppHeader
onClick={callback}
pageData={data}
/>
),
headerLeft: null,
headerStyle: {
shadowOpacity: 0,
shadowOffset: {
height: 0,
},
elevation: 0,
shadowRadius: 0,
},
});}
here AppHeader
is custom header which is React component.
来源:https://stackoverflow.com/questions/63363821/how-to-add-a-second-header-icon-using-headerright-and-icon-button