Ключи в React


Введение в ключи

А “ключ” — это специальный строковый атрибут, который вы нужно включить при создании списков элементов в React. Ключи используются в React для уникального определить, какие элементы в списке изменены, обновлены или удалены. Другими словами, мы можем сказать, что ключи используются для предоставления идентичность элементам в списках. В качестве ключа рекомендуется использовать строку, которая однозначно идентифицирует элементы в списке.

Ниже приведен обновленный код с ключами:

Этот код даст тот же результат, что и предыдущий код (продемонстрировано в модуле «Список») но в это время без предупреждения. Ключи наиболее полезны, когда мы создавать компоненты динамически или когда есть изменение любого рода в списке.


Использование ключей в компонентах

Рассмотрим ситуацию, когда вы создали отдельный компонент для элементов списка и извлекаете элементы списка из этого компонента. В этом случае вам придется назначать ключи компоненту, который вы возвращаете из итератора, а не элементам списка. То есть вы должны назначать ключи, а не тег «так». Чтобы избежать ошибок, рекомендуется помнить, что все, с чего вы возвращаетесь, внутри функции map() необходимо быть назначен ключ.

MenuItems — извлекаемый компонент.

Navmenu — это компонент, который возвращает неупорядоченный список.


Выход

Приведенный выше код можно найти по ссылке, указанной ниже: