我使用数据对象作为ReactJS中组件的props .

<Field data={data} />

我知道验证PropTypes对象本身很容易:

propTypes: {
  data: React.PropTypes.object
}

但是如果我想验证里面的值呢?数据.身份证,数据.标题

props[propName]: React.PropTypes.number.required // etc...

推荐答案

可以使用React.PropTypes.shape来验证属性:

propTypes: {
    data: React.PropTypes.shape({
      id: React.PropTypes.number.isRequired,
      title: React.PropTypes.string
    })
}

Update

正如@Chris在 comments 中指出的那样,从React 15.5.0版开始,React.PropTypes已经迁移到prop-types包.

import PropTypes from 'prop-types';    

propTypes: {
    data: PropTypes.shape({
      id: PropTypes.number.isRequired,
      title: PropTypes.string
    })
}

More info

Reactjs相关问答推荐

无法在列表中看到文本

在Next.js中实现动态更改的服务器组件

如何使Reaction Select 选项菜单从选项数组的特定索引开始

StyleX中的多语言支持

如何解决Reaction中遗留的上下文API错误?

如何在MUI x图表条形图上放置圆角?

如何在中间件中获取 nextAuth 会话

React-router-dom的链接不改变路由(ReactRouter6)

将外部 JavaScript 导入 React(通过文件)

如何实现 redux 工具包来注册用户?

ReactJS 动态禁用按钮

如何从 React Redux store 中删除特定项目?

useState 在生命周期中的位置

如何制作基于对象 struct 呈现数据的可重用组件?

React Router v6 - 访问嵌套路由和处理手写 url 的正确方法

react-query、react-hook-form 和表单验证

在表格中显示具有自定义声明的用户状态

哪个是创建 React 应用程序的更好方法?

React 检测哪些 props 在 useEffect 触发器上发生了变化

为什么 state redux-toolkit 是代理?