從組件本身內(nèi)部檢索React組件的DOM節(jié)點(diǎn)是相當(dāng)簡(jiǎn)單的，但是如果要向后工作怎么辦：按DOM節(jié)點(diǎn)檢索組件的實(shí)例呢？這個(gè)方法是舊的Dojo Toolkit的Dijit框架允許使用的dijit.byId方法，因此讓我思考是否可以使用React進(jìn)行同樣的操作。事實(shí)證明，您可以按DOM節(jié)點(diǎn)檢索組件實(shí)例！

以下函數(shù)允許您通過(guò)DOM節(jié)點(diǎn)獲取React組件實(shí)例：

function findReactElement(node) {     for (var key in node) {         if (key.startsWith("__reactInternalInstance$")) {             return node[key]._debugOwner.stateNode;         }     }     return null;}

如果該節(jié)點(diǎn)是React組件的根，您將看到大量令人驚奇的信息，例如其屬性，狀態(tài)，上下文，引用，方法列表等：

修改道具/狀態(tài)和調(diào)用渲染方法似乎實(shí)際上并沒(méi)有執(zhí)行任何操作，因此從外部看似乎無(wú)法進(jìn)行操作，但是如果僅需檢查，能夠基于DOM節(jié)點(diǎn)獲取組件實(shí)例將非常有用。