Другу помилку знайти було трохи важче, і полягала вона в наступному:
Помилка: Неправильне перевикористання коду, а саме компоненту SuccessText. Або, якщо по-розумному, порушення принципу DRY.
Проблема: Зазвичай ми намагаємось використовувати існуючий код і не копіпастити його. І все йде добре, аж поки не виявиться, що код, який ми вважали спільним є таким лише випадково. По суті - мій компонент
SuccessText - це банер повідомлення що операція пройшла успішно. Чисто випадково він виглядає так само як, на разі, виглядає ціна. Але по суті вони різні і коли ми захочемо змінити ціну, SuccessText має залишитись без змін.Вирішення: Скопіювати компонент
SuccessText в теку buy-product і назвати його ProductPrice. Таким чином ми отримаємо незалежний компонент ще й з логічною назвою. Ось так усе просто. 🙂👉 Для щоб не повторювати цю помилку в майбутньому ви можете використовувати ще одне просте контрольне запитання - чи збігаються підстави для змін цього коду у всіх модулях що їх використовують.
Очевидно, що підстави для змін компоненту ціни і компоненту нотифікації різні, а, отже, це різні компоненти які просто схоже виглядають.
🧐 Такі справи. Як бачите, тема не дуже проста і викладати її доступно завдання не тривіальне (не впевнений що в мене це вийшло навіть зараз, буду вдячний за відгук). Тому відео просувається повільно.
А ви бережіть себе і скоро побачимось.
@reactbeginners