За какво служат порталите в React?

Порталите в React позволяват да се рендират деца компоненти в DOM възел, който се намира извън йерархията на родителския компонент. Това е полезно, когато трябва да се изведе елемент над други, като модални прозорци, подсказки или падащи менюта, за да се избегнат проблеми със CSS стилове, z-index или позициониране.

Пример за използване на портал:

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

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

Тук съдържанието на модалния прозорец ще бъде рендерирано в елемента с id "modal-root", който може да се намира извън основния корен на приложението.