Odczytać dane z komponentu React? [duplikować]
Chciałbym móc odczytać dane powiązane z komponentem reagowania na stronie internetowej innej firmy, która używa React. Chcę móc to przeczytać za pomocą javascript w narzędziach konsoli Chrome Dev na tej stronie. czy to możliwe?
Na przykład mam element TR, który jest rysowany przez reakcję. Chciałbym uzyskać ten TR za pomocą zwykłego document.getElementById (), a następnie użyć go, aby uzyskać podstawowe dane reakcji.
Korzystając z rozszerzenia React Developer Tools, mogę zobaczyć moje dane po prostu tam w props.data - jak mogę to przeczytać?
Zwróć uwagę, że traktuję tutaj Reacta jako czarną skrzynkę.
Uwaga: zgodnie z tą odpowiedzią mogę uzyskać obiekt reakcji z elementu DOM, który działa: React - pobranie komponentu z elementu DOM do debugowania
window.findReactComponent = function(el) {
for (const key in el) {
if (key.startsWith('__reactInternalInstance$')) {
const fiberNode = el[key];
return fiberNode && fiberNode.return && fiberNode.return.stateNode;
}
}
return null;
};
Ale skoro to zrozumiałem, jak mogę dostać się do rekwizytów?
Odpowiedzi
Aha, znalazłem klucz. Musisz uważać, aby uzyskać właściwy element DOM. Za bardzo się starałem w hierarchii. Kiedy już użyłem rozszerzenia narzędzi React Dev, aby „sprawdzić pasujący element DOM”, miałem właściwy element i udało mi się uzyskać jego właściwości.