You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/learn/state-a-components-memory.md
+16-16Lines changed: 16 additions & 16 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -10,8 +10,8 @@ Komponenty często muszą zmieniać to, co jest wyświetlane na ekranie w wyniku
10
10
11
11
<YouWillLearn>
12
12
13
-
* Jak dodać zmienną stanu za pomocą Hooka[`useState`](/reference/react/useState)
14
-
* Jaką parę wartości zwraca Hook`useState`
13
+
* Jak dodać zmienną stanu za pomocą hooka[`useState`](/reference/react/useState)
14
+
* Jaką parę wartości zwraca hook`useState`
15
15
* Jak dodać więcej niż jedną zmienną stanu
16
16
* Dlaczego stan nazywa się lokalnym
17
17
@@ -331,17 +331,17 @@ button {
331
331
332
332
</Sandpack>
333
333
334
-
### Poznaj swój pierwszy Hook {/*meet-your-first-hook*/}
334
+
### Poznaj swój pierwszy hook {/*meet-your-first-hook*/}
335
335
336
-
W Reakcie, `useState`, a także każda inna funkcja zaczynająca się od "`use`", nazywana jest Hookiem.
336
+
W Reakcie, `useState`, a także każda inna funkcja zaczynająca się od "`use`", nazywana jest hookiem.
337
337
338
338
*Hooki* to specjalne funkcje, które są dostępne tylko podczas [renderowania](/learn/render-and-commit#step-1-trigger-a-render) (o czym opowiemy szczegółowo na następnej stronie). Pozwalają one na "podłączenie się" do różnych funkcji Reacta.
339
339
340
-
Stan to tylko jedna z tych funkcji, inne Hooki poznasz później.
340
+
Stan to tylko jedna z tych funkcji, inne hooki poznasz później.
341
341
342
342
<Pitfall>
343
343
344
-
**Hooki—funkcje rozpoczynające się od `use`—można wywoływać tylko na najwyższym poziomie komponentów lub [własnych Hooków.](/learn/reusing-logic-with-custom-hooks)** Nie możesz wywoływać Hooków wewnątrz warunków, pętli ani innych zagnieżdżonych funkcji. Hooki to funkcje, ale warto myśleć o nich jako o bezwarunkowych deklaracjach dotyczących potrzeb komponentu. "Używasz" funkcji Reacta na górze komponentu, podobnie jak "importujesz" moduły na górze pliku.
344
+
**Hooki—funkcje rozpoczynające się od `use`—można wywoływać tylko na najwyższym poziomie komponentów lub [własnych hooków.](/learn/reusing-logic-with-custom-hooks)** Nie możesz wywoływać hooków wewnątrz warunków, pętli ani innych zagnieżdżonych funkcji. hooki to funkcje, ale warto myśleć o nich jako o bezwarunkowych deklaracjach dotyczących potrzeb komponentu. "Używasz" funkcji Reacta na górze komponentu, podobnie jak "importujesz" moduły na górze pliku.
345
345
346
346
</Pitfall>
347
347
@@ -528,9 +528,9 @@ Dobrym pomysłem jest posiadanie wielu zmiennych stanu, jeśli ich stan nie jest
528
528
529
529
Być może zauważyłeś, że wywołanie `useState` nie otrzymuje żadnych informacji o tym, do *której* zmiennej stanu się odnosi. Nie ma żadnego "identyfikatora", który jest przekazywany do `useState`, więc jak React wie, którą zmienną stanu zwrócić? Czy polega to na jakiejś magii, jak analizowanie twoich funkcji? Odpowiedź brzmi nie.
530
530
531
-
Zamiast tego, aby umożliwić ich zwięzłą składnię, Hooki**opierają się na stabilnej kolejności wywołań przy każdym renderze tego samego komponentu.** Działa to dobrze w praktyce, ponieważ jeśli przestrzegasz zasady powyżej ("wywołuj Hooki tylko na najwyższym poziomie"), Hooki będą zawsze wywoływane w tej samej kolejności. Dodatkowo [plugin lintera](https://www.npmjs.com/package/eslint-plugin-react-hooks) wychwytuje większość błędów.
531
+
Zamiast tego, aby umożliwić ich zwięzłą składnię, hooki**opierają się na stabilnej kolejności wywołań przy każdym renderze tego samego komponentu.** Działa to dobrze w praktyce, ponieważ jeśli przestrzegasz zasady powyżej ("wywołuj hooki tylko na najwyższym poziomie"), hooki będą zawsze wywoływane w tej samej kolejności. Dodatkowo [plugin lintera](https://www.npmjs.com/package/eslint-plugin-react-hooks) wychwytuje większość błędów.
532
532
533
-
Wewnątrz Reacta, dla każdego komponentu przechowywana jest tablica par stanu. React utrzymuje również bieżący indeks pary, który jest ustawiony na `0` przed renderowaniem. Za każdym razem, gdy wywołujesz `useState`, React zwraca kolejną parę stanu i inkrementuje indeks. Możesz poczytać więcej o tym mechanizmie w artykule [React Hooks: Not Magic, Just Arrays.](https://medium.com/@ryardley/react-hooks-not-magic-just-arrays-cd4f1857236e)
533
+
Wewnątrz Reacta, dla każdego komponentu przechowywana jest tablica par stanu. React utrzymuje również bieżący indeks pary, który jest ustawiony na `0` przed renderowaniem. Za każdym razem, gdy wywołujesz `useState`, React zwraca kolejną parę stanu i inkrementuje indeks. Możesz poczytać więcej o tym mechanizmie w artykule [React hooks: Not Magic, Just Arrays.](https://medium.com/@ryardley/react-hooks-not-magic-just-arrays-cd4f1857236e)
534
534
535
535
Ten przykład **nie używa Reacta** ale da ci wyobrażenie o tym, jak `useState` działa od środka:
536
536
@@ -546,7 +546,7 @@ function useState(initialState) {
546
546
if (pair) {
547
547
// To nie jest pierwszy render,
548
548
// więc para stanu już istnieje.
549
-
// Zwróć ją i przygotuj się na następne wywołanie Hooka.
549
+
// Zwróć ją i przygotuj się na następne wywołanie hooka.
550
550
currentHookIndex++;
551
551
return pair;
552
552
}
@@ -563,7 +563,7 @@ function useState(initialState) {
563
563
}
564
564
565
565
// Przechowaj parę na przyszłe renderowania
566
-
// i przygotuj się na następne wywołanie Hooka
566
+
// i przygotuj się na następne wywołanie hooka
567
567
componentHooks[currentHookIndex] = pair;
568
568
currentHookIndex++;
569
569
return pair;
@@ -598,7 +598,7 @@ function Gallery() {
598
598
}
599
599
600
600
functionupdateDOM() {
601
-
// Zresetuj bieżący indeks Hooka
601
+
// Zresetuj bieżący indeks hooka
602
602
// przed renderowaniem komponentu.
603
603
currentHookIndex =0;
604
604
let output =Gallery();
@@ -900,9 +900,9 @@ Co jeśli chciałbyś, aby obie galerie miały zsynchronizowany stan? W Reakcie
900
900
<Recap>
901
901
902
902
* Użyj zmiennej stanu, gdy komponent musi "zapamiętać" pewne informacje pomiędzy renderowaniami.
903
-
* Zmienne stanu deklaruje się poprzez wywołanie Hooka`useState`.
903
+
* Zmienne stanu deklaruje się poprzez wywołanie hooka`useState`.
904
904
* Hooki to specjalne funkcje rozpoczynające się od `use`. Pozwalają one „podłączyć się” do funkcji Reacta, takich jak stan.
905
-
* Hooki mogą przypominać importy: muszą być wywoływane bezwarunkowo. Wywoływanie Hooków, w tym `useState`, jest poprawne tylko na najwyższym poziomie komponentu lub innego Hooka.
905
+
* Hooki mogą przypominać importy: muszą być wywoływane bezwarunkowo. Wywoływanie hooków, w tym `useState`, jest poprawne tylko na najwyższym poziomie komponentu lub innego hooka.
906
906
* Hook `useState` zwraca parę wartości: aktualny stan oraz funkcję do jego aktualizacji.
907
907
* Możesz mieć więcej niż jedną zmienną stanu. Wewnętrznie React dopasowuje je według kolejności.
908
908
* Stan jest prywatny dla komponentu. Jeśli renderujesz go w dwóch miejscach, każda kopia ma swój własny stan.
@@ -1331,7 +1331,7 @@ Oto mały formularz, który ma pozwolić użytkownikowi zostawić opinię. Kiedy
1331
1331
1332
1332
<Hint>
1333
1333
1334
-
Czy istnieją jakieś ograniczenia dotyczące _gdzie_ można wywoływać Hooki? Does this component break any rules? Czy ten komponent łamie jakieś zasady? Sprawdź, czy w kodzie znajdują się komentarze wyłączające sprawdzanie przez lintera — to tam często ukrywają się błędy!
1334
+
Czy istnieją jakieś ograniczenia dotyczące _gdzie_ można wywoływać hooki? Does this component break any rules? Czy ten komponent łamie jakieś zasady? Sprawdź, czy w kodzie znajdują się komentarze wyłączające sprawdzanie przez lintera — to tam często ukrywają się błędy!
1335
1335
1336
1336
</Hint>
1337
1337
@@ -1407,9 +1407,9 @@ export default function FeedbackForm() {
1407
1407
1408
1408
</Sandpack>
1409
1409
1410
-
Pamiętaj, że Hooki muszą być wywoływane bezwarunkowo i zawsze w tej samej kolejności!
1410
+
Pamiętaj, że hooki muszą być wywoływane bezwarunkowo i zawsze w tej samej kolejności!
1411
1411
1412
-
Możesz również usunąć niepotrzebną gałąź `else`, aby zredukować zagnieżdżenie. Ważne jest jednak, aby wszystkie wywołania Hooków miały miejsce *przed* pierwszym `return`.
1412
+
Możesz również usunąć niepotrzebną gałąź `else`, aby zredukować zagnieżdżenie. Ważne jest jednak, aby wszystkie wywołania hooków miały miejsce *przed* pierwszym `return`.
0 commit comments