1 00:00:02,400 --> 00:00:09,660 Teraz, gdy są to komunikaty o błędach, otrzymamy komunikaty o błędach podczas programowania, a ich odczytanie jest bardzo ważną rzeczą, 2 00:00:09,660 --> 00:00:14,180 ponieważ naprawdę mogą pomóc nam dowiedzieć się, co jest nie tak. 3 00:00:14,310 --> 00:00:21,870 Przejdźmy teraz do błędów, które niekoniecznie rzucają komunikaty o błędach lub gdzie trzeba głębiej 4 00:00:21,870 --> 00:00:30,840 kopać, aby znaleźć podstawową przyczynę. Teraz powiedzmy na przykład, że w aplikacji. js, chcieliśmy dowiedzieć się, 5 00:00:30,840 --> 00:00:39,390 czy naprawdę usuwamy tutaj właściwy cel. Aby dowiedzieć się, czy tak jest w tym przypadku, możemy 6 00:00:40,500 --> 00:00:50,900 w tym miejscu zalogować się do naszego identyfikatora celu, dodać tekst informacyjny, na przykład usunąć, aby uzyskać informacje o tym, co się tu 7 00:00:50,900 --> 00:00:59,840 drukuje, i oczywiście mamy naszą listę tutaj cele, więc jest to lista bez usuwania elementu, a potem chcielibyśmy go zobaczyć 8 00:00:59,930 --> 00:01:03,360 po usunięciu, ale sposób, w jaki ta 9 00:01:03,770 --> 00:01:06,710 funkcja ustawia stan działa tutaj 10 00:01:06,710 --> 00:01:12,170 w końcu, sposób React aktualizuje stan, po prostu drukując ponownie cele kursu 11 00:01:12,170 --> 00:01:17,350 w tej linii nie podadzą nam już zaktualizowanych celów kursu, zamiast tego 12 00:01:17,370 --> 00:01:20,390 zostaną zaktualizowane dopiero w następnym cyklu renderowania. 13 00:01:20,390 --> 00:01:23,480 Więc nie zobaczymy tam naszych celów kursu, ale to nie jest 14 00:01:23,480 --> 00:01:30,860 problem, musimy tylko zalogować to w innym miejscu, rejestrujemy to tutaj, w naszym komponencie. Tam rejestrujemy cele kursu i cały ten komponent 15 00:01:30,860 --> 00:01:35,920 zostanie ponownie wyrenderowany, gdy zaktualizujemy nasze cele kursu o tę linię, więc 16 00:01:35,920 --> 00:01:36,630 to 17 00:01:36,730 --> 00:01:46,090 się uruchomi ponownie, więc może możemy po prostu dodać trochę dziennika konsoli, ponownie renderując komponent, abyśmy wiemy, że lista celów kursu, 18 00:01:46,090 --> 00:01:54,370 którą drukujemy po tej, jest listą po każdym cyklu ponownego renderowania, podczas gdy lista celów kursu, którą drukujemy po 19 00:01:54,610 --> 00:01:59,890 tej linii do usunięcia, jest listą celów kursu, zanim usunęliśmy cel kursu, 20 00:01:59,890 --> 00:02:04,270 a teraz dodaliśmy kilka instrukcji dziennika konsoli, które pozwalają nam 21 00:02:04,270 --> 00:02:10,390 zanurzyć się w przepływie naszego kodu. Dzięki temu, jeśli to zapiszę, aplikacja uruchomi się ponownie, a my już 22 00:02:10,480 --> 00:02:14,650 zobaczymy komponent do renderowania, który ma sens, zostanie renderowany za pierwszym razem i zobaczymy, że mamy pustą 23 00:02:14,650 --> 00:02:17,210 tablicę, która również ma sens, ponieważ niczego nie dodaliśmy. 24 00:02:17,320 --> 00:02:26,400 Teraz dodajmy nowy cel, może tutaj na Androida, ukończ kurs. Jeśli to zrobimy, zobaczymy ponowne renderowanie 25 00:02:26,470 --> 00:02:33,810 komponentu, ma sens, ponieważ dodaliśmy coś, a co najważniejsze dla drugiego renderowania, 26 00:02:33,810 --> 00:02:39,810 w którym dodaliśmy element, widzimy ten element tutaj w tablicy, 27 00:02:39,810 --> 00:02:51,780 widzimy również identyfikator ten przedmiot i wartość, która wygląda dobrze. Teraz dodajmy kolejny element, naucz się React Native i dodaj to i widzimy to 28 00:02:51,780 --> 00:02:55,350 tutaj, teraz widzimy, że jest to tablica z 29 00:02:55,350 --> 00:03:01,770 dwoma elementami, jeśli rozwiniemy to tutaj. Możemy teraz przejrzeć nasz kod, a teraz usuńmy element, klikając 30 00:03:01,770 --> 00:03:07,560 go i usuńmy element kursu o ID 0. 818 i tak dalej. 31 00:03:08,310 --> 00:03:11,070 Więc jeśli kliknę przycisk Zakończ kurs, zobaczysz, 32 00:03:11,070 --> 00:03:14,380 że został on usunięty, więc wydaje się, że działa 33 00:03:14,400 --> 00:03:20,940 poprawnie i nasz dziennik konsoli to potwierdza, ponownie renderujemy, ponownie renderujemy naszą tablicę tylko z tym identyfikatorem, więc z 34 00:03:20,940 --> 00:03:25,830 drugim element, którego nie usunęliśmy i tam, widzimy, że jest usuwany, to ten identyfikator 35 00:03:25,950 --> 00:03:29,220 tutaj, ten dziennik pochodzi z tego wiersza, zanim go 36 00:03:29,250 --> 00:03:35,490 usunęliśmy, więc nadal jest uwzględniany, ale w następnym cyklu ponownego renderowania widzimy, że to Identyfikator tutaj nie jest 37 00:03:35,490 --> 00:03:36,320 już uwzględniony. 38 00:03:36,390 --> 00:03:38,250 Oczywiście jest to trochę wymyślony 39 00:03:38,250 --> 00:03:43,290 przykład, oczywiście widzimy, że zachowuje się tutaj poprawnie, ale wyobraź sobie, że masz bardziej złożony 40 00:03:43,290 --> 00:03:48,540 przepływ w kodzie, który chcesz debugować, wtedy takie instrukcje dziennika konsoli mogą naprawdę pomóc zrozumieć, w 41 00:03:48,540 --> 00:03:53,310 jaki sposób kod działa, jak często działa i czy używane są prawidłowe wartości. 42 00:03:53,520 --> 00:03:58,470 Tak więc instrukcje dziennika konsoli mogą być naprawdę pomocne, jeśli zrzucisz je do swojego kodu, 43 00:03:58,470 --> 00:04:03,900 po prostu nie zapomnij o ich ostatecznym usunięciu, aby nie tłoczyć kodu za pomocą mnóstwa instrukcji dziennika konsoli.