eslintflowtypeairbnb-js-styleguide

PropType is defined but prop is never used - But it is?


I am getting those errors but I have no idea how to fix them. This is how I define and use the property in question:

type State = {
  isLoading: boolean // <-- 'isLoading' PropType is defined but prop is never used
};
type Props = {};


export default class MyComponent extends Component<State, Props> {
  constructor(props) {
    super(props);
    this.state = { isLoading: true };
  }
 render() {
    const {isLoading } = this.state; // <-- property `isLoading` is missing in  `Props` [1].Flow(InferError)
index.js(25, 52): [1] `Props`
    if (isLoading)
      return (
        <Container>
          <Spinner color="blue" />
        </Container>
      );
 }
}

So there are defined and they are used (when I am destructuring). I also do not understand the Flow error, but they are obviously related.


Solution

  • You reversed the order of Props and State type parameters that you passed to the Component, so Flow thinks props is State and state is Props. That line should look like this, with Props first followed by State:

    export default class MyComponent extends Component<Props, State> {
        // ...
    }
    

    Check out the Flow docs on React components for more.