reactjs - 失败的 Prop 类型 : Invalid prop value `[object Object],[object Object]` , 预期 [null,null] 之一

Question

我是新手。我编写了以下代码来定义我的组件的 PropTypes:

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

我这样调用我的组件:

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

我收到以下警告:

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)
  ......

我将 dataRows 的 Proptype 更改为数组，我收到以下警告:

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

对于对象类型，我会收到类似的警告。你能告诉我我做错了什么吗？我该如何解决？提前致谢。

Answer 1

这是因为 PropTypes.oneOf() 需要一组可能的值而不是类型。您可能希望使用需要类型的 PropTypes.oneOfType() 函数。

这些是来自 prop-types' npm 页面本身的示例:

// 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)
]),

...

所以在你的情况下只写:

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