@FilatovNikita

Зачем нужен атрибут key во vue?

Здравствуйте прочитал кусок из документации
Атрибут key помогает алгоритму работы с виртуальным DOM определить, какие ноды соответствует какой строке данных. Если этот атрибут не указан, Vue использует алгоритм, минимизирующий перемещение элементов и старается обновить и повторно использовать как можно больше элементов правильного типа “на местах”. А если ключ указан, Vue изменяет порядок следования элементов, основываясь на изменении порядка ключей. Элементы, соответствующие ключам, которых больше нет, Vue всегда уничтожает.
Но он мне не совсем понятен, хотелось бы по подробнее и более понятное разъеснение и смысл этого атрибута и как он работает. Заранее спасибо за подробное разъяснение вопроса !
  • Вопрос задан
  • 8469 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега Vue.js
Не знаю, что ещё можно добавить к уже сказанному в документации. Думаю, наглядная демонстрация поможет лучше понять, что к чему.

Пример номер раз - key нет. Пример номер два - key есть. Тыкаем кнопочку и смотрим, что происходит со значениями в инпутах. В первом случае они остаются на месте, во втором начинают ездить по кругу (аналогично элементам массива). Почему так? Возвращаемся к процитированному вами отрывку из документации, и осознаём, что в первом случае

Vue использует алгоритм, минимизирующий перемещение элементов

а во втором

Vue изменяет порядок следования элементов, основываясь на изменении порядка ключей
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
kulakoff
@kulakoff Куратор тега Vue.js
Vue.js developing
Если вы определяете этот атрибут для элемента, то vue точно знает когда нужно обновить этот элемент. Т.е. если вы поменяете ключ, то vue точно удалит старый элемент и создаст новый.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы