web-dev-qa-db-ja.com

this.props.navigation.navigate（react-navigation）のeslintチェックに合格するにはどうすればよいですか？

React Nativeプロジェクトでeslint airbnbを使用しています。小道具、特にreact-navigationからの小道具を検証しなかった場合、eslintはエラーのリントを投げます。

props validation 1 PropTypesを使用してこれを検証するにはどうすればよいですか？

私はこれを次のように検証しようとしています：

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

しかし、まだこのようなエラーリンティングを持っています error lint 2

デフォルトの小道具を渡すにはどうすればよいですか？

eslintreact-navigationreact-proptypes
17
Dede Hamzah

ナビゲーションを設定して、必要な小道具をナビゲートすることで修正しています。

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

eslintは、小道具をオプションに設定した場合、設定するデフォルトの小道具を提供するように強制します。したがって、小道具を必要とするように設定した場合、エスリントは再度警告しません。

22
Dede Hamzah

Dedeによる回答 に加えて、プロジェクトが（基本的に）すべてのコンポーネントにナビゲーションを追加する場合があります。ナビゲーションに小道具の検証を追加することは不必要なタスクであり、その特定の小道具のリンティングを黙らせることもできます。

これを行うには、eslint設定に次を追加します。

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

ただし、使用する前に実際にナビゲーションがコンポーネントに追加されていることを確認する必要があることに注意してください。

17
MikaelHalen