значит ты не писал ничего серьезного

Я уже один вредный совет удалил, чувствую дальше чистить надо

и перерендеривается всегда

И он без ключа работать будет.

и оптимизации реакта в жопе

Нет, опять же

Ну как же нет?

Оч серьезное пишу в том то и дело

Это означает просто что ты никогда не должен менять порядок элементов

Оч серьезное пишу в том то и дело

сочувствую твоему проекту

Оч серьезное пишу в том то и дело

ключ из индекса массива - любая сортировка и у тебя все поедет

Потому что при этом у тебя начнутся лютые эзотерические баги

Может я что-то реально не понимаю

Может я что-то реально не понимаю

https://medium.com/@robinpokorny/index-as-a-key-is-an-anti-pattern-e0349aece318

Не едет сортировка

https://medium.com/@robinpokorny/index-as-a-key-is-an-anti-pattern-e0349aece318

почитай о причинах

Спасибо, ща вникну

ключ из индекса массива - любая сортировка и у тебя все поедет

а если из индекса массива сделать уникальное значение?

Не едет сортировка

значит все перерендеривается когда могло не делать этого

а если из индекса массива сделать уникальное значение?

а толку

а если из индекса массива сделать уникальное значение?

оно не должно от него зависеть

суть в том, чтобы привязать к данным ид, который не будет менять от изменения позиции элементов

можно при получении данных с сервера, нагенерить айдишников

Еще очень классный паттерн { [ <SomeComponent key={someVariable} /> ]} ^ при изменении размаунтит старый компонент и примаунтит новый. Такой супер жесткий forceUpdate.

блин, я у себя, везде index юзал

(

буду править

блин, я у себя, везде index юзал

установи еслинт

блин, я у себя, везде index юзал

npmjs.com/@atomix/eslint-config-react

ок

посмотрю

Еще очень классный паттерн { [ <SomeComponent key={someVariable} /> ]} ^ при изменении размаунтит старый компонент и примаунтит новый. Такой супер жесткий forceUpdate.

иногда годится когда uncontrolled element

а вообще - редко

оно не должно от него зависеть

А разница какая?

Когда надо все загрузчики заново дернуть - самое то

Еще очень классный паттерн { [ <SomeComponent key={someVariable} /> ]} ^ при изменении размаунтит старый компонент и примаунтит новый. Такой супер жесткий forceUpdate.

Ты всё продолжаешь?)

А разница какая?

суть в том, чтобы привязать к данным ид, который не будет меняться от изменения позиции элементов

Вот то что ты сейчас несёшь — это можно делать не вслух, результат будет тот же, я тебе обещаю

Про паттерны, про вот это вот всё

суть в том, чтобы привязать к данным ид, который не будет меняться от изменения позиции элементов

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

То почему (не) работает твой паттерн непосредственно связано с самой сутью ключей и с её пониманием

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

да ладно?

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

не надо ничего такого делать! надо заранее создавать айдишники

не надо ничего такого делать! надо заранее создавать айдишники

так он про это и написал вроде

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

всё ради того, чтобы избежать уникальных ид на каждый рендер

То почему (не) работает твой паттерн непосредственно связано с самой сутью ключей и с её пониманием

Тогда обьясни где я не прав. Я прям думал что понимаю зачем и как ключи работают

так он про это и написал вроде

так может он сделает функцию на основе Math.random()

Тогда обьясни где я не прав. Я прям думал что понимаю зачем и как ключи работают

Ты не не прав, это нормальный процесс осознания новой концепции

Просто, блин, он личный

Ты сам потом с фейспалмом свой паттерн вспомнишь

Потому что он кривой и не красивый? Или какая другая причина?

да ладно?

внатуре

Потому что он кривой и не красивый? Или какая другая причина?

https://reactjs.org/docs/lists-and-keys.html

Потому что он кривой и не красивый? Или какая другая причина?

Потому что это культ карго, попытка воссоздать без понимания, он просто абсурден, не смотря на то что имеет место быть

https://reactjs.org/docs/reconciliation.html#keys

[<Todo key={1} />, <Todo key={2} />] - О! Новые ключики [<Todo key={1} />, <Todo key={3} />] - О! Ключ 2 пропал, надо (именно) размаунтить [<Todo key={10} />, <Todo key={20} />] - О! Оба ключи того - убиваю [<Todo key={1} />] -> [<Todo key={2} />] старый todo пропал, ему unmount, новый появился - mount [<Todo key={1} />] -> [<Todo key={1} />] ничего не изменилось, ничего не делаем.

v

[<Todo key={1} />, <Todo key={2} />] - О! Новые ключики [<Todo key={1} />, <Todo key={3} />] - О! Ключ 2 пропал, надо (именно) размаунтить [<Todo key={10} />, <Todo key={20} />] - О! Оба ключи того - убиваю [<Todo key={1} />] -> [<Todo key={2} />] старый todo пропал, ему unmount, новый появился - mount [<Todo key={1} />] -> [<Todo key={1} />] ничего не изменилось, ничего не делаем.

выше ссылка, там описано как оно реально работает

Если кому-то надо было генерировать “парные” id для label+input или просто некие id для того чтобы в key реакту засунуть: https://twitter.com/theKashey/status/1003273824811380736

юзаю uuid или nanoid

выше ссылка, там описано как оно реально работает

Чем отличается от того что я написал?

JSON.stringify и поiхали

ERROR: S client not available

Интересно, а как по реакт просчитывает дерево чилдов

no offence

Зачем называть паттерном, что является функционалом библиотеки? Ключи решают конкретную проблему, следует только передавать id из полученных данных.

Интересно, а как по реакт просчитывает дерево чилдов

https://reactjs.org/docs/reconciliation.html

Нет, я про другой случай

Я уже год маинтейню react-hot-loader и исходники реакта в районе mount/unmount изучил довольно подробно.

А ну да, всё дерево перерасчитывает, если ему Кей не передать

Я уже год маинтейню react-hot-loader и исходники реакта в районе mount/unmount изучил довольно подробно.

так вот что с ним

:D

Я уже год маинтейню react-hot-loader и исходники реакта в районе mount/unmount изучил довольно подробно.

Если человек твёрдо уверен, что понимает всё, то это признак похуже бесовщины с ключами выше

Потому и спрашиваю где конктретно я не прав

Если человек твёрдо уверен, что понимает всё, то это признак похуже бесовщины с ключами выше

редкие случаи бывают

Если человек твёрдо уверен, что понимает всё, то это признак похуже бесовщины с ключами выше

ты же эффектор понимаешь

Общую концепцию запомнить проще чем готовый принцип готовой библиотеки от и до, так как понимание принципа позволяет не запоминать детали

Порой без знания принципов можно наломать дров

Это не про то

Порой без знания принципов можно наломать дров

s/Порой/Всегда/

Ну рано или поздно да, но раз не про то)

Хотя наверное да, про то)

Общую концепцию запомнить проще чем готовый принцип готовой библиотеки от и до, так как понимание принципа позволяет не запоминать детали

https://github.com/facebook/react/blob/dd5fad29616f706f484938663e93aaadd2a5e594/packages/react-reconciler/src/ReactChildFiber.js#L543 В начале производится проверка key, и в случае успеха идет проверка type в updateElement, которая может или обновить или заменить элемент А если ключи разные - элемент просто проспускается (выкидывается)

Почему ты решил, что имплементация что-либо говорит тебе о концепции, стоящей за ней

https://github.com/facebook/react/blob/dd5fad29616f706f484938663e93aaadd2a5e594/packages/react-reconciler/src/ReactChildFiber.js#L543 В начале производится проверка key, и в случае успеха идет проверка type в updateElement, которая может или обновить или заменить элемент А если ключи разные - элемент просто проспускается (выкидывается)

Поэтому нельзя индекс делать ключем

Я тебе сразу сказал, что всё что ты предложил вполне работает, но от этого не становится менее абсурдным

Это и есть культ карго, в данном случае вместо соломенного самолёта — понимание кода вместо осознания идеи

Реакт ключем задаёт подход к представлению твоих данных

Это не трамплин который нужно лихо перепрыгивать, это направляющая

Обожди - ключ есть и “всегда будет” указателем на то, для чего создан элемент. Если ключ меняется - значит это почти точно “другой элемент”, просто потому что lifecycle _должен_ отработать

Это и есть культ карго, в данном случае вместо соломенного самолёта — понимание кода вместо осознания идеи

Карго культ у меня, или у создателей реакта?