How to Validate That One or the Other Parameter is Present (but not both) in ReactJS Functional Components

Viewed 57

I have a React functional component which I'd like to validate with something like prop-types but I have yet to find a way in which I can validate that one or the other but not both properties are present.

It would also be nice if I could document that one or the other should be present with JSDoc for better syntax validation, though I don't think that's possible.

import React from 'react';
import PropTypes from 'prop-types';

/**
 * @param {String=} props.id
 * @param {String[]=} props.ids 
 */
function MyFunctionalComponent({ id, ids }) {
  // FUNCTION BODY
  return <></>;
}

MyFunctionalComponent.propTypes = {
    id: PropTypes.string,
    ids: PropTypes.arrayOf(PropTypes.string)
}
0 Answers
Related