What are advanced PropTypes in React?

What are advanced PropTypes in React?

Advanced PropTypes in React allow you to define more complex data types for your components, ensuring better validation.

Can you give me an example of using PropTypes.shape?

Sure! You can use PropTypes.shape to define an object with specific properties. For example:

MyComponent.propTypes = {
  user: PropTypes.shape({
    name: PropTypes.string.isRequired,
    age: PropTypes.number,
  }).isRequired,
};

What about PropTypes.oneOf and PropTypes.arrayOf?

PropTypes.oneOf allows you to specify a fixed set of values, while PropTypes.arrayOf is used to validate an array of a specific type. For example:

MyComponent.propTypes = {
  status: PropTypes.oneOf(['active', 'inactive']).isRequired,
  items: PropTypes.arrayOf(PropTypes.string).isRequired,
};

Are there any performance considerations when using PropTypes?

Yes, while PropTypes help with validation during development, they can add overhead. It's best to use them in development mode only.