我如何通过 eslint 检查 this.props.navigation.navigate (react-navigation)？

Question

我在我的 React Native 项目中使用了 eslint airbnb。如果我没有验证道具，尤其是来自 react-navigation.

的道具，eslint 会抛出错误检查

我如何使用 PropTypes 验证这一点？

我正在尝试这样验证它：

IntroScreen.propTypes = {
  navigation: PropTypes.shape({
    navigate: PropTypes.func,
  }),
};

但仍然有这样的错误检查

我应该如何传递默认道具？

Answer 1

我正在通过设置导航和导航属性来修复它。

IntroScreen.propTypes = {
  navigation: PropTypes.shape({
    navigate: PropTypes.func.isRequired,
  }).isRequired,
};

如果我们将 props 设置为可选，eslint 会强制我们提供要设置的默认 props。所以如果我们把props设置为required，eslint就不会再警告你了。

Answer 2

除了之外，有时您的项目可能会向（基本上）所有组件添加导航。为导航添加 props 验证是一项不必要的任务，然后您还不如让该特定 prop 的 linting 静音。

您可以通过在 eslint 配置中添加以下内容来执行此操作：

"rules": {
     "react/prop-types": ["error", { "ignore": ["navigation"] }]
}

请记住，您需要确保在使用导航之前确实将导航添加到您的组件中。

How do i pass eslint checking for this.props.navigation.navigate (react-navigation)?