Damien Leroux Damien Leroux - 25 days ago 16
React JSX Question

How to declare React PropTypes XOR

I used to write components with multiple configuration For example:

ResponsiveTable.PropTypes = {
width: React.PropTypes.number, //used if widthOffset and minWidth are undefined
widthOffset: React.PropTypes.number, //used if width is undefined
minWidth: React.PropTypes.number, //used if width is undefined
};


How can I declare props that can be used only if there i snot already other props set?

A XOR option would be usefull. I read https://facebook.github.io/react/docs/reusable-components.html but it didn't help.

Any ideas?

Answer

Solution:

React.PropTypes.oneOfType([
    React.PropTypes.shape({
        width: React.PropTypes.number.isRequired
    }),
    React.PropTypes.shape({
        widthOffset: React.PropTypes.number,
        minWidth: React.PropTypes.number.isRequired
    }),  
])