Đọc dữ liệu từ thành phần React? [bản sao]

Question

Tôi muốn có thể đọc dữ liệu được liên kết với một thành phần phản ứng trên trang web của bên thứ 3 đang sử dụng React. Tôi muốn có thể đọc nội dung này bằng javascript trong các công cụ bảng điều khiển Chrome Dev trên trang đó. Điều này có khả thi không?

Ví dụ, tôi có một phần tử TR được vẽ bằng phản ứng. Tôi muốn lấy TR này bằng cách sử dụng document.getElementById () thông thường và sau đó sử dụng nó để lấy dữ liệu phản ứng cơ bản.

Sử dụng Tiện ích mở rộng Công cụ dành cho nhà phát triển React, tôi có thể xem dữ liệu của mình ngay dưới props.data - làm cách nào tôi có thể đọc được dữ liệu đó?

Xin lưu ý rằng tôi đang coi React như một hộp đen ở đây.

Lưu ý: theo câu trả lời này, tôi có thể lấy một đối tượng phản ứng từ một phần tử DOM và nó hoạt động: React - nhận một thành phần từ một phần tử DOM để gỡ lỗi

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;
};

Nhưng đã có được điều đó, làm thế nào tôi có thể nhận được đạo cụ?

Answer 1

Aha tôi đã tìm thấy chìa khóa. Bạn cần phải cẩn thận trong việc lấy đúng phần tử DOM. Tôi đã cố gắng đi quá xa về thứ bậc. Sau khi tôi sử dụng tiện ích mở rộng công cụ React Dev để "Kiểm tra phần tử DOM phù hợp", thì tôi đã có phần tử phù hợp và có thể nhận được phần tử của nó.