我已将我的 react-navigation 代码放入一个单独的 Routes 文件中,然后将其导入到我的 App.js 文件中。一切正常,但我在 Atom/Nuclide 中使用 Airbnb ESLint 配置,但 tintColor 出现错误...
“ Prop 验证中缺少 tintColor”
试过这个:
Routes.propTypes = { tintColor: PropTypes.string.isRequired,}
但随后出现错误“tintColor PropType 已定义,但从未使用过 prop”
这是部分代码
const Routes = () = {
const ContentNavigator = TabNavigator(
{
Profile: { screen: ProfileStack },
History: { screen: HistoryStack },
Questions: {
screen: QuestionsStack,
navigationOptions: {
tabBarIcon: ({ tintColor }) => (
<Icon name="question-circle" type="font-awesome" size={20} color=
{tintColor} />
),
},
},
Notifications: { screen: NotificationsStack },
},
{
initialRouteName: 'Profile',
swipeEnabled: true,
tabBarOptions: {
activeTintColor: COLOR_PRIMARY,
},
backBehavior: 'none',
});
最佳答案
您可以创建一个额外的 Functional Component , 添加 PropTypes
为此并在您的主要组件中使用。例如:
...
import PropTypes from 'prop-types';
...
const QuestionsTabBarIcon = ({ tintColor }) => (
<Icon name="question-circle" type="font-awesome" size={20} color={tintColor} />
);
QuestionsTabBarIcon.propTypes = {
tintColor: PropTypes.string.isRequired,
};
...
const ContentNavigator = TabNavigator(
{
Profile: { screen: ProfileStack },
History: { screen: HistoryStack },
Questions: {
screen: QuestionsStack,
navigationOptions: {
tabBarIcon: QuestionsTabBarIcon
},
},
Notifications: { screen: NotificationsStack },
},
{
initialRouteName: 'Profile',
swipeEnabled: true,
tabBarOptions: {
activeTintColor: COLOR_PRIMARY,
},
backBehavior: 'none',
}
);
...
关于javascript - react 导航, Prop 验证中缺少 tintColor,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46396202/