Три популярні помилки початківців в React - state, key, effect

2023 ж. 7 Ақп.
1 288 Рет қаралды

✍️ В цьому відео ми розберемо три помилки, які часто допускають початківці, а саме - React не оновлює дані на екрані, React скаржиться на відсутність ключа в елементах списку та нескінченний рендер під час використання хуку useEffect
✉️ Telegram: t.me/reactbeginners
❤️ Підтримати канал: opencollective.com/farstar
💡Всі матеріали курсу: github.com/Drag13/react-learn...

Пікірлер
  • Нічого нового не дізнався, але дякую за український контент

    @mistertwister931@mistertwister931 Жыл бұрын
    • Так може ви вже й не початківець?)

      @reactdev@reactdev Жыл бұрын
    • @@reactdev виходить що так))

      @mistertwister931@mistertwister931 Жыл бұрын
  • дяка

    @ihorprybula9856@ihorprybula9856 Жыл бұрын
  • 🔥Якраз для мого рівня!

    @user-kc5kr9fq2z@user-kc5kr9fq2z Жыл бұрын
  • Дякую за відео! Контент, як завжди на висоті👍 Так тримати)

    @jamesmay5088@jamesmay5088 Жыл бұрын
    • Дякую за відгук!

      @reactdev@reactdev Жыл бұрын
  • ООйойойойоййй друууже. Це ж україномовний контент... Вподобайку вже вліпив та підписався :))

    @user-ue3ox3ph9g@user-ue3ox3ph9g Жыл бұрын
    • Супер, дякую!

      @reactdev@reactdev Жыл бұрын
  • це база, це фундамент =)

    @egos_ua@egos_ua Жыл бұрын
    • І це теж, дякую за відгук!

      @reactdev@reactdev Жыл бұрын
  • напишу щоб збільшити))

    @vitaliihubariev9523@vitaliihubariev9523 Жыл бұрын
    • Cупер! Дуже вдячний!

      @reactdev@reactdev Жыл бұрын
  • дякую за український контент! 🔥 було б добре, якби ви також показали, що робити з ключами, якшо нема унікального значення і наприклад ім*я може повторюватися і айдішки нема

    @MichaelMelnyk@MichaelMelnyk Жыл бұрын
    • Створювати самостійно, наприклад під час завантаження даних. Дякую за ідею, можливо зробимо коротеньке відео про це

      @reactdev@reactdev Жыл бұрын
    • Вы можете добавлять маску если вам очень приватный ключ нужен. Например так, 'yours index'+'yours megacosmoprivate mask'

      @sevgenberg585@sevgenberg585 Жыл бұрын
    • @@reactdev Зачем снимать про это видео, и так понятно как итератор написать. Можете сделать ролик как правильно работать с АПИ, бо в том ролике, что был до нового года далеко не все...

      @sevgenberg585@sevgenberg585 Жыл бұрын
    • @@reactdev вы уже ответили на этот вопрос, нужно создать счетчик и увеличивать его на каждой итерации при добавлении данных, т.е. другими словами написать свой итератор.

      @sevgenberg585@sevgenberg585 Жыл бұрын
    • @@reactdev uniqueId() з лодаша підійде?

      @taifunov@taifunov Жыл бұрын
  • дякую за відео!

    @user_2782-@user_2782- Жыл бұрын
  • What’s a good value for a key? An easy way to answer this is to ask:when would you say an item is the “same” even if the order changed? > - Dan Abramov

    @sevgenberg585@sevgenberg585 Жыл бұрын
  • Если у меня есть часть данных, на которую подписаны несколько компонентов, я могу использовать эти данные для управления несколькими компонентами? Можете рассказать и показать поподробнее как, а то я это не совсем понял.

    @sevgenberg585@sevgenberg585 Жыл бұрын
  • 3:13 рядок 15, можна спростити `user.userName || "UNKNOWN"` Дякую за відео

    @vasylnahuliak@vasylnahuliak Жыл бұрын
    • Влучно підмітили, дякую!

      @reactdev@reactdev Жыл бұрын
  • А якщо ми передамо в якості ключа id об'єкта? наприклад у нас є { id:n, ..obj }, це ж буде ок?

    @HyndoDristalix14@HyndoDristalix14 Жыл бұрын
    • Якщо ключ сталий (тобто приходить з бекенду, або генерується один раз) то без проблем

      @reactdev@reactdev Жыл бұрын
  • Сравнение типа элемента в той же позиции в дереве обычно достаточно, чтобы решить, следует ли повторно использовать или воссоздать соответствующий экземпляр хоста. Но это хорошо работает только в том случае, если дочерние позиции статичны и не меняют порядок. С динамическими списками мы не можем быть уверены, что порядок всегда одинаков.Если список элементов шё были в вашем примере когда-либо будет переупорядочен, React увидит, что все элементы внутри имеют один и тот же тип, и не будет знать, как их тудою переместить. (С точки зрения React изменились сами элементы, а не их порядок.)

    @sevgenberg585@sevgenberg585 Жыл бұрын
  • охххх, не так і багато курсів по реакт українською... Дякую!

    @iz7066@iz7066 Жыл бұрын
    • Буде більше!

      @reactdev@reactdev Жыл бұрын
  • Хлопцы я с вами не согласен!!!!Проблема шё вы сюдою разговаривали с использованием индекса не в том, что они не уникальны. Они уже есть и это норм. Дело в том, что они ненадежно привязаны к одному и тому же элементу, поэтому, если массив сместится, индекс сместит то, на что он указывает.И все!!!!

    @sevgenberg585@sevgenberg585 Жыл бұрын
    • Дуже гарне зауваження, дякую!

      @reactdev@reactdev Жыл бұрын
  • Вы не могли бы меньше политики в ролике и матюгов, а больше технической информации.Я думаю, что я бы не один был вам за это благодарен.Я понимаю идет война, но все равно нужно быть более толерантным что ли, другое слова в голову сейчас просто не приходят.

    @sevgenberg585@sevgenberg585 Жыл бұрын
    • Як тільки війна закінчиться я буду вообще супер толерантним. Буду прямо пусічка рожева бусінка. А так поки вибачайте.

      @reactdev@reactdev Жыл бұрын
    • Думаю "толерантним" не те слово, що підходить, але про дохлих орків та матюки, то не дуже приємний звучить та виглядає, тим паче що контент в 99% слухають лише українці, та і навряд якісь нацики, які б від таких закидів тащилися

      @amelianceskymusic@amelianceskymusic Жыл бұрын
    • @@amelianceskymusic Я теж волів би жити в світі без орків. Але вони й досі є (

      @reactdev@reactdev Жыл бұрын
    • @@reactdev Навпаки, кількість дохлих орків додає мотивації 💪 А такі "голиби мира" нехай слідують за рускім кораблем 😂

      @marimikhaleva3452@marimikhaleva3452 Жыл бұрын
KZhead