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: content/docs/hooks-custom.md
+12-12Lines changed: 12 additions & 12 deletions
Original file line number
Diff line number
Diff line change
@@ -184,24 +184,24 @@ function ChatRecipientPicker() {
184
184
}
185
185
```
186
186
187
-
We keep the currently chosen friend ID in the `recipientID`state variable, and update it if the user chooses a different friend in the `<select>` picker.
187
+
Przechowujemy aktualnie wybrany identyfikator znajomego w zmiennej stanu `recipientID`i aktualizujemy ją, gdy użytkownik wybierze innego znajomego z rozwijanego pola wyboru `<select>`.
188
188
189
-
Because the `useState`Hook call gives us the latest value of the `recipientID` state variable, we can pass it to our custom`useFriendStatus`Hook as an argument:
189
+
Jako że wywołanie hooka `useState`zwraca najnowszą wartość zmiennej stanu `recipientID`, możemy przekazać ją do naszego własnego hooka`useFriendStatus`jako argument:
This lets us know whether the *currently selected* friend is online. If we pick a different friend and update the`recipientID` state variable, our `useFriendStatus`Hook will unsubscribe from the previously selected friend, and subscribe to the status of the newly selected one.
196
+
Dzięki temu wiemy, czy *aktualnie wybrany* znajomy jest dostępny. Jeżeli wybierzemy innego znajomego, a tym samym zaktualizujemy zmienną stanu`recipientID`, nasz hook `useFriendStatus`anuluje subskrypcję dla poprzednio wybranego znajomego i zasubskrybuje się do statusu nowo wybranego.
197
197
198
-
## `useYourImagination()` {#useyourimagination}
198
+
## Użyj wyobraźni {#useyourimagination}
199
199
200
-
Custom Hooks offer the flexibility of sharing logic that wasn't possible in React components before. You can write custom Hooks that cover a wide range of use cases like form handling, animation, declarative subscriptions, timers, and probably many more we haven't considered. What's more, you can build Hooks that are just as easy to use as React's built-in features.
200
+
Własne hooki dają możliwość współdzielenia logiki w sposób, w jaki dotychczas nie było to możliwe w reactowych komponentach. Możesz pisać własne hooki, które obejmują szereg różnych przypadków - od obsługi formularzy, animacji, deklaratywnych subskrypcji, liczników, po wiele innych, o których nie pomyśleliśmy. Co więcej, możesz tworzyć hooki, które są równie łatwe w użyciu, jak wbudowane funkcje Reacta.
201
201
202
-
Try to resist adding abstraction too early. Now that function components can do more, it's likely that the average function component in your codebase will become longer. This is normal -- don't feel like you *have to* immediately split it into Hooks. But we also encourage you to start spotting cases where a custom Hook could hide complex logic behind a simple interface, or help untangle a messy component.
202
+
Spróbuj powstrzymać się od zbyt wczesnego dodawania abstrakcji. Teraz, kiedy komponenty funkcyjne mogą znacznie więcej, kod źródłowy twoich komponentów najprawdopodobniej zacznie „puchnąć”. To normalne, nie powinieneś od razu *zmuszać się* do dzielenia go na hooki. Ale zachęcamy też do tego, aby zacząć rozglądać się za przypadkami, gdzie własny hook mógłby ukryć skomplikowaną logikę za prostym interfejsem albo pomóc uprzątnąć zagmatwany komponent.
203
203
204
-
For example, maybe you have a complex component that contains a lot of local state that is managed in an ad-hoc way. `useState`doesn't make centralizing the update logic any easier so might you prefer to write it as a [Redux](https://redux.js.org/) reducer:
204
+
Załóżmy na przykład, że masz w swoim kodzie skomplikowany komponent z dużą ilością zmiennych stanu, zarządzanych ad-hoc. Hook `useState`nie jest wcale rozwiązaniem na łatwą centralizację tej logiki, więc pewnie lepiej będzie ci napisać [reduxowy](https://redux.js.org/)reduktor (ang. *reducer*):
205
205
206
206
```js
207
207
functiontodosReducer(state, action) {
@@ -211,16 +211,16 @@ function todosReducer(state, action) {
211
211
text:action.text,
212
212
completed:false
213
213
}];
214
-
// ... other actions ...
214
+
// ... inne akcje ...
215
215
default:
216
216
return state;
217
217
}
218
218
}
219
219
```
220
220
221
-
Reducers are very convenient to test in isolation, and scale to express complex update logic. You can further break them apart into smaller reducers if necessary. However, you might also enjoy the benefits of using React local state, or might not want to install another library.
221
+
Reduktory są bardzo wygodne do testowania w izolacji i skalowania w celu wyrażenia skomplikowanej logiki aktualizacji. W razie potrzeby możesz je rozbić na mniejsze reduktory. Tym niemniej, być może wolisz korzystać z zalet lokalnego stanu Reacta albo po prostu nie chcesz instalować kolejnej biblioteki.
222
222
223
-
So what if we could write a `useReducer` Hook that lets us manage the *local* state of our component with a reducer? A simplified version of it might look like this:
223
+
A co jeśli moglibyśmy napisać hook `useReducer`, który pozwala na zarządzanie *lokalnym* stanem komponentu przy użyciu reduktora? Jego uproszczona wersja mogłaby wyglądać następująco:
224
224
225
225
```js
226
226
functionuseReducer(reducer, initialState) {
@@ -235,7 +235,7 @@ function useReducer(reducer, initialState) {
235
235
}
236
236
```
237
237
238
-
Now we could use it in our component, and let the reducer drive its state management:
238
+
Teraz możemy go użyć w naszym komponencie i pozwolić reduktorowi na zarządzanie jego stanem:
239
239
240
240
```js{2}
241
241
function Todos() {
@@ -249,4 +249,4 @@ function Todos() {
249
249
}
250
250
```
251
251
252
-
The need to manage local state with a reducer in a complex component is common enough that we've built the `useReducer`Hook right into React. You'll find it together with other built-in Hooks in the [Hooks API reference](/docs/hooks-reference.html).
252
+
Potrzeba zarządzania lokalnym stanem złożonego komponentu za pomocą reduktora jest na tyle powszechna, że wbudowaliśmy hook `useReducer`bezpośrednio w Reacta. Jego opis, wraz z innymi wbudowanymi hookami, znajdziesz w rozdziale [Hooki - interfejs API](/docs/hooks-reference.html).
0 commit comments