Warning: Failed prop type: Invalid prop `somecomponentfunction` of type `function` supplied to `myComponent`, expected `boolean`

Question

I am facing this warning and am sure its something related to PropTypes

in my parent component somecomponentfunction and its returning a boolean and am passing the same to child component

in prent component

  somecomponentfunction = () => {
    this.setState({ somecomponentfunction: false })
  }

and am passing to childComponet like

<myComponent somecomponentfunction={this.somecomponentfunction} />

and in child component and am just getting the same in props and am checking the same in PropTypes

myComponent.PropTypes={
 somecomponentfunction: PropTypes.bool,
}

Can you guys tell what went wrong

Answer 1

That's because PropTypes does not execute your function and check if the result returned is a boolean or not. It directly checks what type that prop is carrying.

So somecomponentfunction is not a boolean, but a function. If you want to have the result of that function you need to either execute directly

somecomponentfunction={this.somecomponentfunction()}

or change the propType control to:

somecomponentfunction: PropTypes.func