1
00:00:02,380 --> 00:00:06,940
Możemy teraz przejść do ekranu gry, a komputer zgaduje

2
00:00:06,970 --> 00:00:12,340
tutaj liczbę, liczbę losową, która wyklucza naszą rzeczywistą liczbę przy pierwszym zgadywaniu.

3
00:00:12,370 --> 00:00:18,010
Teraz musimy upewnić się, że możliwe będzie dokonanie kolejnych domysłów po naciśnięciu dolnego lub większego przycisku

4
00:00:18,010 --> 00:00:21,350
tutaj na ekranie gry. W tym

5
00:00:21,400 --> 00:00:27,820
celu dodajmy funkcję wewnątrz naszego komponentu funkcjonalnego, ponieważ ta funkcja będzie potrzebowała dostępu do

6
00:00:27,820 --> 00:00:36,790
otaczającego stanu i otaczającego komponentu i nadać mu dowolną nazwę, na przykład następną metodę odgadywania, dowolną nazwę, którą preferujesz,

7
00:00:36,790 --> 00:00:38,700
a jest to funkcja,

8
00:00:38,710 --> 00:00:43,810
która powinieneś dostać argument, w którym kierunku powinny być kolejne przypuszczenia,

9
00:00:43,810 --> 00:00:47,390
tak niższe lub większe. Teraz pierwszą

10
00:00:47,390 --> 00:00:54,060
rzeczą, którą chcę tutaj zrobić, jest upewnienie się, że potwierdzamy kierunek.

11
00:00:54,110 --> 00:00:59,600
Teraz ta funkcja powinna zostać wykonana po naciśnięciu przycisków tam, ale oczywiście wartość

12
00:00:59,600 --> 00:01:04,970
kierunku, więc wartość, którą przekazujemy jako argument, powinna się różnić w zależności

13
00:01:05,240 --> 00:01:06,190
od przycisku.

14
00:01:06,200 --> 00:01:13,070
Tak więc mamy kolejny moduł obsługi zgadywania podłączony do onPress, bez nawiasów, które po prostu dostarczą

15
00:01:13,100 --> 00:01:19,140
ten wskaźnik w naszej funkcji do funkcji onPress, aby to wykonało się ostatecznie, gdy

16
00:01:19,140 --> 00:01:26,060
użytkownik go naciśnie, ale poszedłem wstępnie skonfigurować argument, który zostanie przekazany następnemu modułowi obsługi zgadywania kiedy to

17
00:01:26,060 --> 00:01:27,350
zostanie wykonane.

18
00:01:27,350 --> 00:01:33,530
Możemy to zrobić za pomocą bind, bind to, ponieważ pierwszy argument do bindowania zawsze powinien odnosić się do

19
00:01:33,530 --> 00:01:38,450
wywoływanej funkcji, nie ma tutaj znaczenia, więc możemy po prostu to z tym powiązać.

20
00:01:38,600 --> 00:01:44,780
Druga wartość, którą przekazujemy tutaj do wiązania, będzie pierwszym argumentem otrzymanym przez naszą funkcję i

21
00:01:44,810 --> 00:01:51,580
dlatego będzie to kierunek tutaj otrzymany i oczywiście od Ciebie zależy, którą logikę tu zastosujesz, dla mnie

22
00:01:51,580 --> 00:01:52,560
sensowne jest

23
00:01:52,600 --> 00:02:00,820
po prostu użycie łańcuch, gdzie tutaj przekazujemy niżej jako łańcuch, a dla drugiego przycisku przekazujemy większy, dzięki czemu mamy te

24
00:02:00,970 --> 00:02:02,710
dwa identyfikatory, które są

25
00:02:02,740 --> 00:02:08,830
zasadniczo przekazywane do następnego modułu obsługi zgadywania. Tak więc kierunek będzie niższy lub

26
00:02:08,830 --> 00:02:10,780
większy i teraz

27
00:02:10,900 --> 00:02:14,110
chcemy sprawdzić, czy jest to poprawne.

28
00:02:14,110 --> 00:02:20,670
Na przykład, jeśli wybrałeś liczbę, powiedzmy 55, a komputer zgadł 60, to jeśli podasz komputerowi,

29
00:02:20,800 --> 00:02:25,390
wskazówka liczb powinna być większa, to oczywiście błędna, ponieważ liczba

30
00:02:25,390 --> 00:02:30,190
powinna być mniejsza, twoja liczba to 55, zgadnij było 60, to

31
00:02:30,190 --> 00:02:31,690
jest niepoprawne,

32
00:02:31,690 --> 00:02:37,790
jeśli powiesz komputerowi, że liczba, którą powinien odgadnąć, powinna być większa niż 60, prawda?

33
00:02:37,810 --> 00:02:39,340
Chcemy to

34
00:02:39,540 --> 00:02:43,370
sprawdzić i dlatego możemy sprawdzić, czy kierunek

35
00:02:43,390 --> 00:02:54,870
jest równy niższemu, więc jeśli nacisnąłeś dolny przycisk, a bieżące domysły są jednak mniejsze, to podpiera wybór użytkownika, więc komputer faktycznie odgadł liczbę

36
00:02:54,880 --> 00:03:01,270
mniejszą niż nasz wybór, a następnie niższy jest niewłaściwą wskazówką właściwą, ponieważ liczba

37
00:03:01,270 --> 00:03:03,900
musi być mniejsza, musi być

38
00:03:03,970 --> 00:03:11,100
większa, ponieważ domysły były już zbyt niskie. Więc to jest jeden możliwy scenariusz, w którym otrzymujemy

39
00:03:11,100 --> 00:03:16,110
niewłaściwą wskazówkę, alternatywę i zawinę to w nawiasy, aby było naprawdę jasne, że jest

40
00:03:16,110 --> 00:03:18,300
to jeden z warunków tutaj.

41
00:03:18,330 --> 00:03:20,440
Tak więc alternatywą jest

42
00:03:20,490 --> 00:03:26,010
to, że drugim warunkiem, który chcę sprawdzić, jest to, że kierunek tutaj jest w

43
00:03:26,250 --> 00:03:30,920
rzeczywistości większy, a jednocześnie obecne przypuszczenie jest już większe niż nasz wybór,

44
00:03:30,930 --> 00:03:33,460
a następnie jest to również nieprawidłowa

45
00:03:33,480 --> 00:03:35,600
wskazówka, tylko w przeciwnym kierunku.

46
00:03:35,940 --> 00:03:41,220
W obu przypadkach, gdy podajemy niepoprawną wskazówkę, chcę rzucić alert, a dowiedziałeś się, że możesz to zrobić za

47
00:03:41,220 --> 00:03:48,300
pomocą interfejsu API alertów, klasy alertów, którą możesz zaimportować z React Native. Następnie tutaj, w naszym czeku, użyję alertu,

48
00:03:48,300 --> 00:03:55,460
aby wysłać alert z tytułem powiedzmy, nie kłam, oczywiście możesz wybrać dowolne imię, unikam pojedynczego

49
00:03:55,530 --> 00:03:57,820
cytatu, który poszedłem wydrukować

50
00:03:57,840 --> 00:04:03,240
jako znak z wiodącym odwrotnym ukośnikiem, ponieważ w przeciwnym razie zamknąłby

51
00:04:03,240 --> 00:04:07,710
ciąg, ponieważ używam pojedynczych cudzysłowów do otaczania moich ciągów.

52
00:04:07,710 --> 00:04:09,010
Więc to mój tytuł

53
00:04:09,090 --> 00:04:13,230
i wtedy tekst może być taki, że wiesz, że to źle, ale oczywiście możesz mieć

54
00:04:13,230 --> 00:04:19,480
tutaj dowolny tekst, możesz też być mniej moralistyczny, jeśli chcesz. Teraz chcę przedstawić tutaj jeden przycisk, a

55
00:04:19,480 --> 00:04:25,260
przycisk mówi, że już wyjaśniono, że przekazujesz obiekty do trzeciej tablicy argumentów, które

56
00:04:25,320 --> 00:04:32,880
przyjmuje alert i tam może być przykro, a styl może być anulowany i nie musisz udostępniać procedury obsługi

57
00:04:32,880 --> 00:04:39,120
onPress, jeśli go nie podasz, jedyne, co się stanie, to kliknięcie przycisku spowoduje zamknięcie

58
00:04:39,120 --> 00:04:41,400
alertu, co jest w porządku.

59
00:04:42,000 --> 00:04:47,550
Więc tutaj dajemy użytkownikowi dotknięcie palcami, aby to powiedzieć, i upewniamy się, że nie podano

60
00:04:47,550 --> 00:04:48,530
żadnych niepoprawnych

61
00:04:48,600 --> 00:04:50,040
wskazówek i chcę

62
00:04:50,040 --> 00:04:54,590
tu wrócić, więc chcę zatrzymać wykonywanie funkcji, jeśli mamy taką niepoprawną wartość.

63
00:04:54,780 --> 00:04:56,580
Jeśli przejdziemy przez ten

64
00:04:56,580 --> 00:05:01,330
blok if, więc jeśli damy prawidłową wskazówkę, to chcemy wygenerować nową liczbę losową.

65
00:05:01,920 --> 00:05:06,940
Więc tutaj chcę sprawdzić, czy kierunek jest niższy, a teraz

66
00:05:07,200 --> 00:05:08,850
wiemy, że był

67
00:05:08,850 --> 00:05:15,810
poprawny, więc komputer powinien odgadnąć liczbę, która jest mniejsza niż poprzednia liczba, wtedy wiemy, że

68
00:05:15,810 --> 00:05:22,170
nowa liczba losowa powinna zostać wygenerowana w kierunku bieżącej domysły maksymalna górna granica.

69
00:05:22,200 --> 00:05:29,940
Dlatego możemy wywołać generowanie losowe między ponownie a liczbą minimalną, no cóż, to prawdopodobnie jeden, ale co,

70
00:05:30,060 --> 00:05:32,930
jeśli użytkownik już odgadł inny

71
00:05:32,940 --> 00:05:39,440
numer, w którym powiedzieliśmy komputerowi, że jest zbyt mały, a wtedy mielibyśmy problem, ponieważ

72
00:05:39,540 --> 00:05:44,410
najniższa granica nie zawsze jest jedna, co jeśli użytkownik zgadł

73
00:05:44,430 --> 00:05:48,430
10, a my powiedzieliśmy „nie”, to musi być większa?

74
00:05:48,480 --> 00:05:53,670
Cóż, wtedy użytkownik zgaduje 50 i mówimy, że powinien być niższy, komputer powinien oczywiście

75
00:05:53,670 --> 00:05:54,410
zgadywać,

76
00:05:54,420 --> 00:06:00,240
ale nie powinien zgadywać poniżej 10, ponieważ już wspominaliśmy, że jest to zbyt małe wcześniej.

77
00:06:00,330 --> 00:06:08,700
Dlatego nasze obecne maksimum i minimum powinno się zmieniać w miarę upływu czasu, ponieważ dajemy wskazówki dotyczące tego, czy liczba, którą komputer odgadł,

78
00:06:08,700 --> 00:06:11,080
jest za mała, czy za duża.

79
00:06:12,130 --> 00:06:16,690
Dlatego możemy użyć innego haka dostarczonego przez React, a mianowicie haka useRef.

80
00:06:16,690 --> 00:06:23,290
Teraz możesz znać ten hak jako hak, który pozwala ci utworzyć obiekt, który możesz powiązać z danymi wejściowymi, a więc z

81
00:06:23,350 --> 00:06:28,960
elementami wejściowymi w jsx, aby uzyskać do nich dostęp w kodzie i jest to jeden ze sposobów

82
00:06:28,960 --> 00:06:33,870
korzystania z niego, ale useRef pozwala również zrobić coś innego, co jest całkiem fajne.

83
00:06:34,120 --> 00:06:39,720
Pozwala zdefiniować wartość, która przetrwa ponowne renderowanie komponentu, która przetrwa, że ten komponent

84
00:06:39,760 --> 00:06:42,810
zostanie odbudowany i właśnie tego potrzebujemy,

85
00:06:43,120 --> 00:06:48,940
ponieważ chcemy zalogować się do minimum i maksimum, które możemy zmienić, ale które

86
00:06:49,180 --> 00:06:53,320
nie jest regenerowane tylko ponieważ komponent jest renderowany ponownie.

87
00:06:53,320 --> 00:07:00,060
Więc tutaj na górze tego komponentu, po zainicjowaniu stanu, możemy utworzyć nową stałą,

88
00:07:00,360 --> 00:07:10,430
currentLow, być może gdzie useRef to jedna, a następnie inna stała, currentHigh, gdzie useRef wynosi 100, to są nasze

89
00:07:10,440 --> 00:07:16,590
początkowe granice, których używamy losowo numer, a teraz możemy zaktualizować te odniesienia

90
00:07:17,160 --> 00:07:18,240
tutaj.

91
00:07:18,390 --> 00:07:20,790
Więc wiemy, że kierunek powinien być niższy, co

92
00:07:20,790 --> 00:07:27,450
możemy zrobić w takim przypadku, zamiast natychmiastowego generowania nowej liczby, możemy ustawić currentHigh. prąd, ponieważ referencje generowane przez

93
00:07:27,450 --> 00:07:33,960
React są obiektami, które mają bieżącą właściwość, w której przechowywana jest

94
00:07:33,960 --> 00:07:36,120
rzeczywista wartość, więc

95
00:07:36,150 --> 00:07:39,320
ustawiamy prąd na wartość domyślną.

96
00:07:39,330 --> 00:07:45,570
Więc mówimy, jeśli mówię ci, że komputer, który zgadywałeś, jest zbyt duży i powinieneś zgadnąć

97
00:07:45,570 --> 00:07:53,610
niższy, to wiem, że ten numer, który, jak sądzę, jest moim bieżącym. Wysoki, prawidłowy numer może t będzie wyższy niż

98
00:07:53,610 --> 00:07:55,320
ten, więc zapisuję

99
00:07:55,320 --> 00:07:58,780
liczbę, którą właśnie odgadnąłem jako moją najwyższą wartość.

100
00:07:58,800 --> 00:08:05,160
I znowu, te stałe odniesienia tutaj nie są regenerowane, gdy ten komponent jest tworzony ponownie,

101
00:08:05,160 --> 00:08:11,700
zamiast tego, jeśli zostały one zainicjowane raz, trochę tak jak w rzeczywistości, to są przechowywane

102
00:08:11,790 --> 00:08:17,490
odłączone od tego komponentu i React rozpoznaje, że zostały już zainicjowane i nie

103
00:08:17,490 --> 00:08:22,440
zregeneruje ich, ale zamiast tego zainicjuje currentHigh z poprzednio zapisaną wartością.

104
00:08:22,440 --> 00:08:28,240
To trochę tak, jakbyś zarządzał tym w stanie, różnica w stanie zamiast tego, jeśli zmienisz przechowywaną tam

105
00:08:28,240 --> 00:08:32,290
wartość, składnik nie renderuje się ponownie, ponieważ nie chcemy tego tutaj.

106
00:08:32,370 --> 00:08:37,890
Nie chcę ponownie renderować tego komponentu tylko dlatego, że zapisuję nowy rekord, który nie ma wpływu na

107
00:08:37,890 --> 00:08:39,780
mój widok, na mój kod

108
00:08:39,780 --> 00:08:44,020
jsx, ma tylko wpływ na moją logikę, ale w tym celu nie

109
00:08:44,070 --> 00:08:47,580
muszę ponownie renderować komponent, dlatego używam tutaj odwołania zamiast stanu.

110
00:08:47,640 --> 00:08:50,730
Dzieje się tak, jeśli jest niższy,

111
00:08:50,760 --> 00:08:55,980
więc jeśli powiedzielibyśmy komputerowi, że domysły były zbyt małe, a rzeczywista

112
00:08:55,980 --> 00:08:57,060
liczba powinna być

113
00:08:57,060 --> 00:09:04,970
wyższa, powinna być większa, w takim przypadku ustawiliśmy niski prąd na bieżący, ponieważ wtedy wiemy mamy niższą

114
00:09:04,970 --> 00:09:06,020
granicę.

115
00:09:06,230 --> 00:09:12,230
A teraz celem lub sztuczką jest wygenerowanie nowej liczby losowej, która bierze pod uwagę te granice,

116
00:09:12,230 --> 00:09:13,280
więc gdzie

117
00:09:13,280 --> 00:09:22,190
używamy obecnego minimum z naszym ref i wtedy. prąd jako minimum i currentHigh. prąd jako maksimum i

118
00:09:22,190 --> 00:09:30,850
chcę wykluczyć bieżące zgadywanie, abyśmy nie mogli zgadnąć ponownie tego samego numeru, więc na następną

119
00:09:30,850 --> 00:09:38,440
rolę na pewno otrzymamy inną liczbę. Więc to jest coś, co przechowuję w stałej, następnej liczbie,

120
00:09:38,440 --> 00:09:39,900
jest generowane tutaj, gdy

121
00:09:39,910 --> 00:09:41,200
wykonywany jest

122
00:09:41,350 --> 00:09:46,020
następny moduł obsługi zgadywania, co dzieje się, gdy klikniemy jeden z tych przycisków.

123
00:09:46,240 --> 00:09:49,140
A teraz następny numer to następny numer, którego

124
00:09:49,150 --> 00:09:54,370
chcemy użyć, więc teraz to, co możemy po prostu zrobić, jak możemy nazwać, ustaw bieżące zgadywanie i

125
00:09:54,370 --> 00:10:01,660
dodaj następny numer, teraz komponent zostanie ponownie zrenderowany i wyświetli następne zgadnięcie. Spróbujmy, bo na razie nie ma gry, która

126
00:10:01,660 --> 00:10:02,960
jest zbyt

127
00:10:02,980 --> 00:10:06,820
wysoka, ale przynajmniej możemy spróbować zgadnąć liczby tutaj.

128
00:10:06,850 --> 00:10:09,250
Więc wpisuję 53 jako swój

129
00:10:09,250 --> 00:10:12,040
numer, teraz zaczynamy i komputer zgadł 85.

130
00:10:12,100 --> 00:10:18,220
Jeśli teraz powiem większe, otrzymamy to ostrzeżenie, ponieważ skłamaliśmy, mieliśmy 53 jako liczbę, więc przypuszczenie jest zbyt

131
00:10:18,220 --> 00:10:21,590
wysokie, powinno być niższe.

132
00:10:21,610 --> 00:10:23,260
Teraz jest 28, cóż, to zbyt nisko, powinno być większe.

133
00:10:23,260 --> 00:10:28,830
Więc jeśli stuknę niżej, dostanę ostrzeżenie, jeśli stuknę większy, przejdziemy teraz w górę 78,

134
00:10:28,840 --> 00:10:34,030
a teraz w tym momencie, 23, poprzednie przypuszczenie będzie naszą dolną granicą, a

135
00:10:34,030 --> 00:10:38,360
teraz, gdy dotknę niższego, 78 obecne przypuszczenie będzie naszą górną granicę,

136
00:10:38,380 --> 00:10:44,300
więc następne przypuszczenie na pewno nie będzie powyżej 78 i nie będzie poniżej 23, ale

137
00:10:44,430 --> 00:10:46,690
wciąż jest zbyt niskie, to jest

138
00:10:46,690 --> 00:10:48,460
zbyt duże, to znaczy,

139
00:10:48,460 --> 00:10:49,580
jest zbyt

140
00:10:49,600 --> 00:10:51,520
niskie, więc użyjmy większej, dolnej

141
00:10:51,520 --> 00:10:53,460
i to byłby właściwy .

142
00:10:53,500 --> 00:10:56,560
Na razie nie mamy nic, co by sprawdzało, czy

143
00:10:56,580 --> 00:10:57,820
komputer zgadł poprawnie.

144
00:10:58,120 --> 00:11:00,130
To kolejna rzecz, którą będziemy musieli wdrożyć tutaj.