Ponowne renderowanie komponentu po zmianach w localStorage - React.js

Czy jeśli np mam w React.js komponent <Header>, który służy do renderowania headera mogę w jakiś sposób ponownie go wyrenderować po zmianach w localStorage? Po pierwszym renderingu ponownie on się nie renderuje, ponieważ nic w nim się nie zmienia. Jednak po tym jak zostanie wpisane coś do localStorage chciałym ponownie go wyrenderować aby dodać pewny element do niego.

@tsz: dzięki, ale co w tym evencie należałoby zrobić aby ponownie wybrany komponent wyrenderować?

I czy sessionStorage też coś takiego posiada?

Dodałem w componentDidMount event storage, ale w ogóle on się nie wykonuje przy wpisywaniu czegoś do localStorage. Dodam, że do localStorage wpisuje coś w innym komponencie.

A jak to zaimplementowałeś? Ja właśnie sobie z powodzeniem strzeliłem takim eventem pomiędzy dwoma zakładami z 4P. Dla sessionStorage oczywiście też powinno działać.

@tsz: ale przecież ten event działa tylko w innych otwartych kartach:

The StorageEvent is fired whenever a change is made to the Storage object (note that this event is not fired for sessionStorage changes). This won't work on the same page that is making the changes — it is really a way for other pages on the domain using the storage to sync any changes that are made. Pages on other domains can't access the same storage objects.

Coś bajdurzysz :)

Taki kod dodałem w headerze:

class Header extends Component {
  
  componentDidMount() {
    window.addEventListener("storage", this.storageEventHandler);
  }

  storageEventHandler(evt) {
    alert("storage updated");
  }

W innym komponencie do localStorage coś wpisuje po wysłaniu forma, ale alert się nie wyświetla.