unmountComponentAtNode

Устаревший

unmountComponentAtNode(domNode)

• Справочник
  • unmountComponentAtNode(domNode)
• Использование
  • Удаление приложения React из элемента DOM

Справочник

unmountComponentAtNode(domNode)

Вызовите unmountComponentAtNode для удаления смонтированного компонента React из DOM и очистки обработчиков событий и состояния.

import { unmountComponentAtNode } from 'react-dom';

const domNode = document.getElementById('root');
render(<App />, domNode);

unmountComponentAtNode(domNode);

См. примеры ниже.

Параметры

• domNode: Элемент DOM. React удалит смонтированный компонент React из этого элемента.

Возвращаемое значение

unmountComponentAtNode возвращает true, если компонент был размонтирован, и false в противном случае.

Использование

Вызовите unmountComponentAtNode для удаления смонтированного компонента React из узла DOM браузера и очистки обработчиков событий и состояния.

import { render, unmountComponentAtNode } from 'react-dom';
import App from './App.js';

const rootNode = document.getElementById('root');
render(<App />, rootNode);

// ...
unmountComponentAtNode(rootNode);

Удаление приложения React из элемента DOM

Иногда вам может потребоваться «добавить» React на существующую страницу или страницу, которая не полностью написана на React. В таких случаях вам может понадобиться «остановить» приложение React, удалив всё пользовательское интерфейс, состояние и обработчики из узла DOM, к которому оно было рендерировано.

В этом примере нажатие на «Отобразить приложение React» отобразит приложение React. Нажмите «Размонтировать приложение React», чтобы его уничтожить:

import './styles.css';
import { render, unmountComponentAtNode } from 'react-dom';
import App from './App.js';

const domNode = document.getElementById('root');

document.getElementById('render').addEventListener('click', () => {
  render(<App />, domNode);
});

document.getElementById('unmount').addEventListener('click', () => {
  unmountComponentAtNode(domNode);
});