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>), 
} 

爲我工作。