reactjs - React 的无效 Prop 类型 'array' 预期 'object'

Question

我在详细页面中显示公司信息(来自公司列表，通过 React Link 在参数中发送 ID)

现在我们正在谈论详细信息页面。我收到 ID，为 json 数组调用 api:

 {"_id":"58f7f61cff8d4014d7f7730b","company_name":"Vodafone" .... } 

并期望它是:

export default class Detail extends Component {
  static propTypes = {
    getCompany: PropTypes.func.isRequired,
    **company**: PropTypes.array,
  }

一切正常，接收并显示，但我仍然收到警告:

"Warning: Failed prop type: Invalid prop `company` of type `object` supplied to `Detail`, expected `array`."

我对 react 还很陌生，所以我想也许我的 API 没有返回数组，但是当我将公司的 Prop 定义切换为“对象”时，我得到了相同的警告，但问题相反 - 接收数组，期待对象，所以这是一个我找不到出路的圆圈。

有没有人见过类似的东西？是公司的问题还是 API 的问题？

非常感谢

Answer 1

错误消息很容易解释:您传递的值是包含公司数据的单个对象。所以正确的 Prop 类型应该是 PropTypes.object，像这样:

export default class Detail extends Component {
    static propTypes = {
        getCompany: PropTypes.func.isRequired,
        company: PropTypes.object
    }
}

如果你的数据有时是一个数组，有时是一个对象，你可以这样使用:

export default class Detail extends Component {
    static propTypes = {
        getCompany: PropTypes.func.isRequired,
        company: PropTypes.oneOf([PropTypes.object, PropTypes.array])
    }
}

但这会有点违背整个 prop 类型的目的，所以你或许应该确保你总是传递一个数组或一个对象给组件。