这里的答案似乎并没有完全涵盖对孩子们的检查。node和object太允许，我想检查确切的元素。这是我最终使用的:

使用oneOfType([])允许使用单个或一组子元素 对于单个子数组和数组子数组，分别使用shape和arrayOf(shape({})) 对于子元素本身使用oneOf

最后，是这样的:

import PropTypes from 'prop-types'
import MyComponent from './MyComponent'

children: PropTypes.oneOfType([
  PropTypes.shape({
    type: PropTypes.oneOf([MyComponent]),
  }),
  PropTypes.arrayOf(
    PropTypes.shape({
      type: PropTypes.oneOf([MyComponent]),
    })
  ),
]).isRequired

这个问题帮助我更清楚地了解了这一点:https://github.com/facebook/react/issues/2979

根据propTypes文档元素用于React元素，children是其中之一:

// A React element.
optionalElement: PropTypes.element,

然后你可以用arrayOf组合它

组件。propTypes = { 孩子们:PropTypes.arrayOf .isRequired (PropTypes.element), };

那么它至少需要一个子代。

尝试使用oneOfType或PropTypes.node这样做

import PropTypes from 'prop-types'

...

static propTypes = {
    children: PropTypes.oneOfType([
        PropTypes.arrayOf(PropTypes.node),
        PropTypes.node
    ]).isRequired
}

or

static propTypes = {
    children: PropTypes.node.isRequired,
}

如果你想包含渲染道具组件:

  children: PropTypes.oneOfType([
    PropTypes.arrayOf(PropTypes.node),
    PropTypes.node,
    PropTypes.func
  ])

尝试自定义propTypes:

 const  childrenPropTypeLogic = (props, propName, componentName) => {
          const prop = props[propName];
          return React.Children
                   .toArray(prop)
                   .find(child => child.type !== 'div') && new Error(`${componentName} only accepts "div" elements`);
 };


static propTypes = {

   children : childrenPropTypeLogic

}

小提琴

const {Component, PropTypes} = React; const childrenPropTypeLogic = (props, propName, componentName) => { var error; var prop = props[propName]; React.Children.forEach(prop, function (child) { if (child.type !== 'div') { error = new Error( '`' + componentName + '` only accepts children of type `div`.' ); } }); return error; }; class ContainerComponent extends Component { static propTypes = { children: childrenPropTypeLogic, } render() { return ( <div> {this.props.children} </div> ); } } class App extends Component { render(){ return ( <ContainerComponent> <div>1</div> <div>2</div> </ContainerComponent> ) } } ReactDOM.render(<App /> , document.querySelector('section')) <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> <section />

如果您想精确匹配某个组件类型，请选中此选项

MenuPrimary.propTypes = {
  children: PropTypes.oneOfType([
    PropTypes.arrayOf(MenuPrimaryItem),
    PropTypes.objectOf(MenuPrimaryItem)
  ])
}

如果您希望精确匹配某些组件类型，请选中此选项

const HeaderTypes = [
  PropTypes.objectOf(MenuPrimary),
  PropTypes.objectOf(UserInfo)
]

Header.propTypes = {
  children: PropTypes.oneOfType([
    PropTypes.arrayOf(PropTypes.oneOfType([...HeaderTypes])),
    ...HeaderTypes
  ])
}