React PropTypes DOM元素？

Question

如何将一个属性标记为必须是DOM元素？

This page说PropTypes.element实际上是一个阵营元素，有啥为DOM元素相当于？

Answer 1

您可以检查通过的财产是Element实例：

Element接口表示文档的对象。该接口描述了各种元素共有的方法和属性。在从Element继承的接口中描述了特定行为，但添加了其他功能。例如，HTMLElement接口是HTML元素的基本接口，而SVGElement接口是所有SVG元素的基础。

class Some extends React.Component { 
 
    render() { 
 
    return (
 
     <div> Hello </div> 
 
    ); 
 
    } 
 
} 
 

 
const validateDOMElem = (props, propName, componentName) => { 
 
    if (props[propName] instanceof Element === false) { 
 
    return new Error(
 
     'Invalid prop `' + propName + '` supplied to' + 
 
     ' `' + componentName + '`. Validation failed.' 
 
    ); 
 
    } 
 
} 
 

 
Some.propTypes = { 
 
    htmlElem: validateDOMElem, 
 
}; 
 

 
const para = document.getElementById('para'); 
 

 
ReactDOM.render(<Some htmlElem={para} />, document.getElementById('app'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.js"></script> 
 

 
<div id="app"></div> 
 
<p id="para"></p>

Answer 2

例如与列表组件：

MyList.propTypes = { 
    children: PropTypes.instanceOf(<li></li>), 
} 

为我工作。