Reputation: 41
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.
Upvotes: 4
Views: 5617
Reputation: 582
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,
Upvotes: 10