react-native-ui-kitten: Bottom navigation with icons: invalid props tintColor
Issue type
I’m submitting a … (check one with “x”)
- bug report?
- feature request
Issue description
Current behavior:
When I add any icons to bottom tab navigation (e.g. @expo/vector-icons) it shows me
Warning: Failed prop type: Invalid props.style key tintColor
supplied to Text
.
Expected behavior: no warnings.
Steps to reproduce: I’ve basically copy-pasted “With React Navigation API and usage example” from Bottom Navigation documentation and added few icons from @expo/vector-icons to the tabs.
Related code:
import { MaterialIcons } from '@expo/vector-icons';
const WalletIcon = ({ tintColor }) =>
<MaterialIcons color={tintColor} name="compare-arrows" size={24} />
<BottomNavigationTab title='Accounts' icon={WalletIcon} />
Other information:
OS, device, package version
WIN10, Android Emulator API 29
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Comments: 16
it still not fixed i am facing the same issue .
Fortunately, we’ve already faced this issue and currently working on it. The reason is that
vector-icons
render a Text, which we didn’t expect to be returned fromicon
prop. This will be fixed in the next versionThanks for reporting this
in my case I am facing this error
Warning: Failed prop type: Invalid props.style key tintColor supplied to Text
while using @expo/vector-icons as Input’s accessory, quick fix for me is to wrap icon with fragment and warning will disappear.There are two options for you now:
Image
componentAgain, the fix will be available in the next release 😃