Skip to content

Commit 25250a9

Browse files
jakubdrozdekg12i
andauthored
Apply third batch of suggestions from code review
Co-Authored-By: g12i <grzebieniowski@gmail.com>
1 parent 510eec2 commit 25250a9

File tree

1 file changed

+3
-3
lines changed

1 file changed

+3
-3
lines changed

content/docs/hooks-effect.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -446,12 +446,12 @@ To wymaganie jest na tyle powszechne, że zostało wbudowane w interfejs API hoo
446446
```js{3}
447447
useEffect(() => {
448448
document.title = `Klknięto ${count} razy`;
449-
}, [count]); // Uruchom ponownie efekt, tylko jeśli zmieni się wartość count
449+
}, [count]); // Uruchom ponownie efekt tylko wtedy, gdy zmieni się wartość count
450450
```
451451
452452
W powyższym przykładzie przekazujemy `[count]` jako drugi argument. Co to oznacza? Jeśli `count` ma wartość `5`, a nasz komponent jest ponownie renderowany z `count` wciąż równym `5`, React porówna `[5]` z poprzedniego renderowania i `[5]` z kolejnego renderowania. Ponieważ wszystkie elementy w tablicy są takie same (`5 === 5`), React pominie efekt. Oto nasza optymalizacja.
453453
454-
Kiedy renderujemy z wartością `count` zaktualizowaną do `6`, React porówna elementy tablicy `[5]` z poprzedniego renderowania do elementów w tablicy `[6]` z kolejnego renderowania. Tym razem React ponownie zastosuje efekt, ponieważ `5 !== 6`. Jeśli w tablicy jest wiele elementów, React ponownie uruchomi efekt, nawet jeśli tylko jeden z nich jest inny.
454+
Kiedy renderujemy z wartością `count` zaktualizowaną do `6`, React porówna elementy tablicy `[5]` z poprzedniego renderowania do elementów w tablicy `[6]` z kolejnego renderowania. Tym razem React ponownie zastosuje efekt, ponieważ `5 !== 6`. Jeśli w tablicy jest wiele elementów, React ponownie uruchomi efekt, nawet jeśli tylko jeden z nich mą inną wartość.
455455
456456
Działa to również w przypadku efektów z fazą czyszczenia:
457457
@@ -465,7 +465,7 @@ useEffect(() => {
465465
return () => {
466466
ChatAPI.unsubscribeFromFriendStatus(props.friend.id, handleStatusChange);
467467
};
468-
}, [props.friend.id]); // Zasubskrybuj ponownie tylko wtedy, jeśli zmieni się wartość props.friend.id
468+
}, [props.friend.id]); // Zasubskrybuj ponownie tylko wtedy, gdy zmieni się wartość props.friend.id
469469
```
470470
471471
W przyszłości drugi argument może zostać automatycznie dodawany w czasie kompilacji.

0 commit comments

Comments
 (0)