Перейти к содержанию

React DOM API

Пакет react-dom содержит методы, которые поддерживаются только для веб-приложений (которые работают в среде DOM браузера). Они не поддерживаются для React Native.

API

Эти API могут быть импортированы из ваших компонентов. Они используются редко:

  • createPortal позволяет рендерить дочерние компоненты в другой части дерева DOM.
  • flushSync позволяет заставить React промыть обновление состояния и синхронно обновить DOM.

Ресурсные API для предварительной загрузки

Эти API можно использовать для ускорения работы приложений путем предварительной загрузки ресурсов, таких как скрипты, таблицы стилей и шрифты, как только вы узнаете, что они вам нужны, например, перед переходом на другую страницу, где эти ресурсы будут использоваться.

Фреймворки React часто выполняют загрузку ресурсов за вас, поэтому вы можете не вызывать эти API самостоятельно. За подробностями обращайтесь к документации вашего фреймворка.

  • prefetchDNS позволяет предварительно получить IP-адрес DNS-имени домена, к которому вы ожидаете подключиться.
  • preconnect позволяет вам подключиться к серверу, с которого вы ожидаете запросить ресурсы, даже если вы еще не знаете, какие ресурсы вам понадобятся.
  • preload позволяет получить таблицу стилей, шрифт, изображение или внешний скрипт, который вы предполагаете использовать.
  • preloadModule позволяет получить модуль ESM, который предполагается использовать.
  • preinit позволяет получить и оценить внешний скрипт или получить и вставить таблицу стилей.
  • preinitModule позволяет получить и оценить ESM-модуль.

Точки входа

Пакет react-dom предоставляет две дополнительные точки входа:

  • react-dom/client содержит API для рендеринга компонентов React на клиенте (в браузере).
  • react-dom/server содержит API для рендеринга React-компонентов на сервере.

Утратившие актуальность API

Эти API будут удалены в будущей основной версии React.

  • findDOMNode находит ближайший узел DOM, соответствующий экземпляру компонента класса.
  • hydrate монтирует дерево в DOM, созданное из серверного HTML. Утратил силу в пользу hydrateRoot.
  • render монтирует дерево в DOM. Утратил силу в пользу createRoot.
  • unmountComponentAtNode размонтирует дерево из DOM. Утратил силу в пользу root.unmount().

Комментарии