Teneff
Teneff

Reputation: 32158

How to validate react prop that should accept Component

Let's say I want my component to accept a property of type React.Component

const MyComponent = ({ child: Child }) => 
  <div>
    <Child {...childProps} />
  </div>

MyComponent.propTypes = {
  child: PropTypes.[???].isRequired
}

Is there any React.Component validator in prop-types that I can use ?

edit: I've tried with PropTypes.element, but I get an error Failed prop type: Invalid prop 'el' of type 'function' supplied to 'Test', expected a single ReactElement.

https://codesandbox.io/s/qk0jyq13yj

edit2: I've just found in material-ui they have custom validation

Upvotes: 0

Views: 241

Answers (1)

Danyal Imran
Danyal Imran

Reputation: 2605

Use the element property

MyComponent.propTypes = {
  child: PropTypes.element.isRequired
}

or instanceOf

MyComponent.propTypes = {
  child: PropTypes.instanceOf(ReactComponentName).isRequired
}

Upvotes: 3

Related Questions