menggunakan this.state.variable di dalam fungsi

aku mempunyai fungsi seperti ini

function HomeScreen() {
const color = this.state.tabs_header;
return (
<Tab.Navigator
initialRouteName="Scanner"
screenOptions={({route}) => ({
tabBarIcon: ({focused, color, size}) => {
let iconName; if (route.name === 'Home') {iconName = focused ? 'home' : 'home-outline'; }
else if (route.name === 'Scanner') { iconName = focused ? 'camera' : 'camera-outline';  }
else if (route.name === 'About') { iconName = focused ? 'information-circle' : 'information-circle-outline'; }
return <Ionicons name={iconName} size={size} color={color} />; }, })}
tabBarOptions={{
showLabel: false,
activeTintColor: '#B2D0D7',
inactiveTintColor: '#8FB2BA',
style: { height: SCREEN_HEIGHT * 0.08,
backgroundColor: color,
},
}}>

<Tab.Screen name="Home" component={TabAScreen} />
<Tab.Screen name="Scanner" component={TabBScreen} />
<Tab.Screen name="About" component={TabCScreen} />

</Tab.Navigator>
);

}

jika cek di console log nilainya dapat tapi masalahnya this.state.tabs_header tidak bisa digunakan di dalam fungsi tersebut.

tolong, aku sudah stuck disini terus...