Odczytać dane z komponentu React? [duplikować]

Dec 01 2020

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

1 DanielWilliams Dec 01 2020 at 06:19

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.