Failed prop type: Invalid prop value `[object Object],[object Object]`, expected one of [null,null]

Question

I am new to react. I wrote following code to define the PropTypes of my component:

ListViewer.propTypes = {
    dataRows: PropTypes.oneOf([PropTypes.object, PropTypes.array]).isRequired,
    columnHeaders: PropTypes.object.isRequired,
    headerColumn: PropTypes.string.isRequired,
    onRowPress: PropTypes.func.isRequired,
}

And I called my component like following:

const items= [{
            name: "Iodine",
            price: 33,
            amount: 11
        },
        {
            name: "Chlorine",
            price: 23,
            amount: 1
        }];
..... 
..... 
<ListViewer dataRows={items} columnHeaders={headers} headerColumn="name" onRowPress={this.onRowPress}/>
.....

I got following warning:

Warning: Failed prop type: Invalid prop `dataRows` of value `[object Object]` supplied to `ListViewer`, expected one of [null,null].
    in ListViewer (at AvailableItems.js:53)
    in AvailableItems (at SceneView.tsx:122)
    in StaticContainer
    in StaticContainer (at SceneView.tsx:115)
  ......

I changed the Proptype of dataRows to array, I get following warning:

Warning: Failed prop type: Invalid prop `dataRows` of type `object` supplied to `ListViewer`, expected `array`

And for type of object I get a similar warning. Could you please tell me what am I doing wrong and how can I fix it? Thanks in advance.

Answer 1

It is because PropTypes.oneOf() expects an array of possible values not types. You likely want to use the PropTypes.oneOfType() function which expects types.

These are examples from the prop-types' npm page itself:

// You can ensure that your prop is limited to specific values by treating
// it as an enum.
optionalEnum: PropTypes.oneOf(['News', 'Photos']),

// An object that could be one of many types
optionalUnion: PropTypes.oneOfType([
  PropTypes.string,
  PropTypes.number
  PropTypes.instanceOf(Message)
]),

...

So in your case just write:

dataRows: PropTypes.oneOfType([PropTypes.object, PropTypes.array]).isRequired,