Насколько я понимаю, это означает, что React обновляет только то, что необходимо, а не разрушает и заново строит все дерево DOM. Я не прав?
Если вы хотите узнать краткий ответ, я должен сказать, что это true , React обновит необходимые элементы в DOM всякий раз, когда это необходимо .
Но если вы хотите знать, как это делается, и когда React обновит DOM и его элемент, я должен изменить его по-разному, например архитектура проекта, используя надлежащие методы (надлежащие перехватчики в функциональном компоненте, например. useCallback, useMemo и т. д.) и т. д.
Когда он действительно получит рендеринг, тогда?
Насколько я знаю, есть два способа, которыми React узнает, когда нужно перерисовать DOM.
Передача элементов в ReactDOM.render
Обновление состояния
Что такое ReactDOM.render?
Это вызовет метод render() из react-dom (где мы обычно импортируют его как ReactDOM), и он отображает элемент React в DOM в предоставленном контейнере и возвращает ссылку на компонент (или возвращает null для компонентов без состояния). Кроме того, если элемент React ранее отображался в контейнере, он будет обновлять его и изменять только DOM по мере необходимости, чтобы отразить последний элемент React.
Что означает состояние?
В объекте state хранятся значения свойств, которые принадлежат компоненту. Поэтому, когда у вас есть компонент, и у этого компонента есть свои собственные определенные c переменные, изменение которых должно влиять на DOM, вы должны его использовать, тогда, когда состояние получает изменения, компонент будет обновляться.
Так что я вообще говорил об архитектуре проекта и подобных вещах, когда я ничего не упомянул об этом выше?
Скажем, у нас есть проект с одним родительским компонентом и 3 дочерними Компонент просто так:
Component 1
- |- Component 2
- - |- Component 3
- - - |- Component 4
Поэтому, когда вы state in Component 4, все элементы DOM будут перерисованы, почему тогда? Поскольку Component 4 является дочерним элементом Component 3 и т. Д., Поэтому, когда дочернее состояние получает изменение, оно заставит родителя повторно выполнить рендеринг, тогда весь DOM будет повторно отображаться один раз за состояние изменить.
Заключительное примечание
Итак, наконец, мы всегда должны рассматриваться как хорошая архитектура и иерархия для нашего проекта или когда он обязательно использует встроенные методы, такие как useMemo чтобы избежать такого.