Zašto su portali u React-u?

Portali u React-u omogućavaju renderovanje decom komponenti u DOM čvoru koji se nalazi van hijerarhije roditeljske komponente. Ovo je korisno kada je potrebno prikazati element iznad drugih, poput modal prozora, tooltipova ili padajućih menija, kako bi se izbegli problemi sa CSS stilovima, z-index ili pozicioniranjem.

Primer korišćenja portala:

import React from 'react';
import ReactDOM from 'react-dom';

function Modal({ children }) {
  return ReactDOM.createPortal(
    <div className="modal">
      {children}
    </div>,
    document.getElementById('modal-root')
  );
}

Ovde će sadržaj modal prozora biti renderovan u elementu sa ID "modal-root", koji može biti izvan glavnog korena aplikacije.