Milleks on Reactis portalid?

Reacti portaalid võimaldavad renderdada lapsekomponente DOM-i sõlme, mis asub väljaspool vanemkomponendi hierarhiat. See on kasulik, kui soovite kuvada elementi teiste kohal, näiteks modaalaknad, tööriistapad või rippmenüüd, et vältida CSS-ide, z-indexi või positsioneerimise probleeme.

Portaali kasutamise näide:

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

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

Siin kuvatakse modaalakna sisu elemendis, mille ID on "modal-root", mis võib asuda väljaspool rakenduse põhijuurt.