I've been working on converting react-native code from JavaScript to TypeScript and upgrading the version.
However, I'm facing an issue with react-navigationHeaderOptions not functioning as expected. I'm unable to pinpoint the cause of this problem.
Here is a snippet from DocumentNavigation.tsx:
import {DocumentsScreen} from '../../screens/Documents/DocumentsScreen'
import DocumentsInFolder from '../../screens/Documents/DocumentsInFolder'
export default createStackNavigator({DocumentsScreen, DocumentsInFolder}, {
headerMode: 'none',
navigationOptions: {
gesturesEnabled: false,
},
transitionConfig : () => ({
transitionSpec: {
duration: 0,
timing: Animated.timing,
easing: Easing.step0,
},
}),
})
In DocumentsScreen.tsx:
export const DocumentsScreen: NavigationScreenComponent<{}> = () => {
return (
<Container>
<Text>Hello</Text>
</Container>
)
}
DocumentsScreen.navigationOptions = (props: NavigationScreenProps): NavigationStackScreenOptions => {
// navigation options implementation here
}
// Additional styling components defined below
Despite expecting the navigation header to display correctly, it's currently completely invisible. Can someone please assist me in resolving this issue?