Hide header in stack navigator React navigation

I'm trying to switch screens using both stack and tab navigator.

const MainNavigation = StackNavigator({
otp: { screen: OTPlogin },
otpverify: { screen: OTPverification},
userVerified: {
screen: TabNavigator({
List: { screen: List },
Settings: { screen: Settings }
}),
},
});

In this case stack navigator is used first and then tab navigator. I want to hide the headers from stack navigator. Which is not working properly when I use navigation options like::

navigationOptions: { header: { visible: false } }

i'm trying this code on first two components which are using in stacknavigator.
if i use this line then getting some error like:

[![enter image description here][1]][1]


[1]: