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/tutorial/tutorial.md
+6-6Lines changed: 6 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -265,7 +265,7 @@ Ha most kattintasz a Square-re, egy értesítést kell láss a böngésződben.
265
265
266
266
Következő lépésként azt próbáljuk elérni, hogy a Square komponens "emlékezzen" arra, hogy rá lett kattintva, és töltse ki magát egy "X"-szel. Ahhoz, hogy komponensek "emlékezni" tudjanak, **state**-t (állapotot) használnak.
267
267
268
-
React komponensekben állapotot a `this.state` segítségével deklarálhatunk, a konstruktorban. A `this.state` állapotra úgy kell tekintenünk, hogy az privát legyen abban az osztályban, amiben az definiálva lett. Tároljuk a Square jelenlegi értékét a `this.state` objektumban, és változtassuk azt meg, ha a Square-re kattintunk.
268
+
React komponensekben állapotot a `this.state` segítségével deklarálhatunk a konstruktorban. A `this.state` állapotra úgy kell tekintenünk, hogy az privát legyen abban az osztályban, amiben az definiálva lett. Tároljuk a Square jelenlegi értékét a `this.state` objektumban, és változtassuk azt meg, ha a Square-re kattintunk.
269
269
270
270
Először is adjunk hozzá egy konstruktort az osztályhoz, hogy inicializáljuk az állapotot:
271
271
@@ -455,7 +455,7 @@ Amikor a Square komponensre rákattintanak, az `onClick` függvény meg lesz hí
455
455
2. Amikor a gombra kattintanak, a React meghívja az `onClick` eseményfigyelőt, ami a Square komponens `render()` metódusában definiálva lett.
456
456
3. Ez az eseményfigyelő meghívja a `this.props.onClick()` függvényt. A Square `onClick` propja a Board komponensben lett definiálva.
457
457
4. Mivel a Board leküldte az `onClick={() => this.handleClick(i)}` propot a Square komponensnek, a Square meghívja a `this.handleClick(i)` függvényt, ha rákattintanak.
458
-
5. Mivel a `handleClick()` metódust még nem definiáltuk, a kódunk összeomlik. Ha most kattintasz egy négyzetre, egy piros hibát kell látnod a képernyőt, ami valami olyat mond, hogy "this.handleClik is not a function", azaz "a this.handleClick nem függvény".
458
+
5. Mivel a `handleClick()` metódust még nem definiáltuk, a kódunk összeomlik. Ha most kattintasz egy négyzetre, egy piros hibát kell látnod a képernyőn, ami valami olyat mond, hogy "this.handleClick is not a function", azaz "a this.handleClick nem függvény".
459
459
460
460
>Megjegyzés
461
461
>
@@ -560,7 +560,7 @@ A változások észlelése egy megváltoztathatatlan objektum esetén jelentőse
A megváltoztathatatlanság legfőbb előnye, hogy az segít a Reactben _tiszta komponensek_ építésében. A megváltoztathatatlan adat könnyen megállapíthatja, ha valamilyen változás történt, ami azt segít megállapítani, hogy egy komponensnek újra kell-e renderelnie.
563
+
A megváltoztathatatlanság legfőbb előnye, hogy az segít a Reactben _tiszta komponensek_ építésében. A megváltoztathatatlan adat könnyen megállapíthatja, ha valamilyen változás történt, ami azt segít meghatározni, hogy egy komponensnek újra kell-e renderelnie.
564
564
565
565
A `shouldComponentUpdate()` metódusról, és hogy hogyan készíts *tiszta komponenseket*, a [Teljesítmény optimalizálása](/docs/optimizing-performance.html#examples) olvasásával tanulhatsz többet.
566
566
@@ -717,7 +717,7 @@ function calculateWinner(squares) {
717
717
}
718
718
```
719
719
720
-
Adott egy 9 négyzetet tartalmazó tömb, ez a függvény leellenőrzi hogy van-e győztes, és ennek megfelelően visszaadhat `'X'`-szet, `'O'`-t, vagy `null` értéket.
720
+
Adott egy 9 négyzetet tartalmazó tömb, ez a függvény leellenőrzi, hogy van-e győztes, és ennek megfelelően visszaadhat `'X'`-szet, `'O'`-t, vagy `null` értéket.
721
721
722
722
A `calculateWinner(squares)` függvényt meghívjuk a Board `render` metódusában, hogy megtudjuk van-e győztes. Ha egy játékos nyert, akkor mutathatunk valami olyan szöveget mint: "Győztes: X" vagy "Győztes: O". Cseréljük le a `status` deklarációját is a Board `render` metódusában erre a kódra:
723
723
@@ -735,7 +735,7 @@ A `calculateWinner(squares)` függvényt meghívjuk a Board `render` metódusáb
735
735
// más változás nincs
736
736
```
737
737
738
-
Most már megváltoztathatjuk a Board `handleClick` metódusát is, hogy az korán térjen vissza, ignorálva a kattintásokat, ha valaki megnyerte a játékot, vagy ha a Square már ki van töltve:
738
+
Most már megváltoztathatjuk a Board `handleClick` metódusát is, hogy az előbb térjen vissza, ignorálva a kattintásokat, ha valaki megnyerte a játékot, vagy ha a Square már ki van töltve:
739
739
740
740
```javascript{3-5}
741
741
handleClick(i) {
@@ -1203,7 +1203,7 @@ Nézd meg a végeredményt itt: **[Végeredmény](https://codepen.io/gaearon/pen
1203
1203
Ha van egy kis extra időd, vagy szeretnéd gyakorolni a React új képességeidet, íme pár ötlet a tic-tac-toe játék tökéletesítéséhez, nehézség szerint növekvő sorrendben:
1204
1204
1205
1205
1. Mutasd minden lépés pozícióját az (oszlop, sor) formátumban a lépéstörténet listában.
1206
-
2. Tedd kövérré a jelenleg kiválasztott element a lépés listában.
1206
+
2. Tedd félkövérré az aktuálisan kiválasztott elemet a lépés listában.
1207
1207
3. Írd át a Board komponenst úgy, hogy az két ciklust használjon négyzetek készítéséhez belekódolás helyett.
1208
1208
4. Adj hozzá egy kapcsoló gombot, ami lehetővé teszi a lépések szortírozását növekvő vagy csökkenő sorrendben.
1209
1209
5. Ha valaki nyer, emeld ki a három négyzetet, ami lehetővé tette a játékosnak a nyerést.
0 commit comments