如何檢查Dom元素或React組件

創建HOC時我不確定哪種組件會被包裝，有時它是另一個React組件，有時它可能是一個純DOM元素，如li和a。如何檢查Dom元素或React組件

WrappedComp = myHOC(BaseComponent)

MyHOC將傳遞額外的道具給包裝的組件，在大多數情況下，這將工作，因爲它應該。

但有時BaseComponent是例如li它不會接受額外的道具和陣營將拋出一個警告Unkown Prop Warning說，DOM元素不接受非標準的DOM屬性：https://facebook.github.io/react/warnings/unknown-prop.html

所以，我怎麼能檢查如果BaseComponent是DOM元素還是其他？如果是我不會將額外的道具傳遞給它。

有沒有更好的方法來做到這一點？

來源

2017-04-12 Leonardo

你檢查了'console.log（BaseComponent）'的輸出嗎？ –

爲什麼你需要將HOC包裝到每個組件上？是否有可能包裝和導出您想要擴展的組件？ – hazardous

最簡單的檢查就是看看它的'function'，typeof（BaseComponent）==「function」，對於HTML組件，反應使用'string'。 – hazardous

檢查BaseComponent是否爲React組件，並添加所需的道具。

if(BaseComponent.prototype.isReactComponent){ 
    //add props 
}

來源

2017-04-12 12:44:22

關於此任何文檔？ – Leonardo

https://github.com/facebook/react/blob/b1b4a2fb252f26fe10d29ba60d85ff89a85ff3ec/src/isomorphic/modern/class/ReactBaseClasses.js#L33你可以在源代碼中看到它。 – rlemon

我想內部功能沒有記錄不應該使用，因爲他們可以隨時更改。如果使用純渲染函數，這也不起作用 – Leonardo

如何檢查Dom元素或React組件

回答

相關問題