Skip to content

Commit c5fdcb8

Browse files
Merge pull request #38 from reactjs/translate-fragments
translate fragments
2 parents 8b1fe9d + dd730ae commit c5fdcb8

1 file changed

Lines changed: 19 additions & 19 deletions

File tree

content/docs/fragments.md

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
---
22
id: fragments
3-
title: Fragments
3+
title: Fraqmentlər
44
permalink: docs/fragments.html
55
---
66

7-
A common pattern in React is for a component to return multiple elements. Fragments let you group a list of children without adding extra nodes to the DOM.
7+
React-də ümumi pattern çoxlu elementlərə komponentin qayıtması üçündür. Fraqmentlər sizə DOM-a nodelar əlavə etmədən uşaqların siyahısını qruplaşdırmağa imkan verir.
88

99
```js
1010
render() {
@@ -18,11 +18,11 @@ render() {
1818
}
1919
```
2020

21-
There is also a new [short syntax](#short-syntax) for declaring them, but it isn't supported by all popular tools yet.
21+
Burada həmçinin onları bəyan etmək üçün yeni [qısa sintaksis](#short-syntax) var, amma bu hələki bütün məşhur alətlər tərəfindən dəstəklənmir.
2222

23-
## Motivation {#motivation}
23+
## Motivasiya {#motivation}
2424

25-
A common pattern is for a component to return a list of children. Take this example React snippet:
25+
Komponentlərdə uşaqlar siyahısını qaytarmaq çox işlənən bir patterndir. React-in kod parçası misalına baxın:
2626

2727
```jsx
2828
class Table extends React.Component {
@@ -38,7 +38,7 @@ class Table extends React.Component {
3838
}
3939
```
4040

41-
`<Columns />` would need to return multiple `<td>` elements in order for the rendered HTML to be valid. If a parent div was used inside the `render()` of `<Columns />`, then the resulting HTML will be invalid.
41+
Render edilmiş HTML-in etibarlı olması üçün `<Columns />` çoxsaylı `<td>` elementlərinə qayıtmalı ola bilərlər. Əgər valideyn div `<Columns />`-un `render()`-inin daxilində istifadə olunubsa, onda nəticələnən HTML etibarsızdır.
4242

4343
```jsx
4444
class Columns extends React.Component {
@@ -53,7 +53,7 @@ class Columns extends React.Component {
5353
}
5454
```
5555

56-
results in a `<Table />` output of:
56+
yekun `<Table />` nəticəsi:
5757

5858
```jsx
5959
<table>
@@ -66,9 +66,9 @@ results in a `<Table />` output of:
6666
</table>
6767
```
6868

69-
Fragments solve this problem.
69+
Fraqmentlər bu problemi həll edir.
7070

71-
## Usage {#usage}
71+
## İstifadə {#usage}
7272

7373
```jsx{4,7}
7474
class Columns extends React.Component {
@@ -83,7 +83,7 @@ class Columns extends React.Component {
8383
}
8484
```
8585

86-
which results in a correct `<Table />` output of:
86+
hansıki düzgün `<Table />` nəticəsi ilə yekunlaşacaq:
8787

8888
```jsx
8989
<table>
@@ -94,9 +94,9 @@ which results in a correct `<Table />` output of:
9494
</table>
9595
```
9696

97-
### Short Syntax {#short-syntax}
97+
### Qısa Sintaksis {#short-syntax}
9898

99-
There is a new, shorter syntax you can use for declaring fragments. It looks like empty tags:
99+
Fraqmentləri bəyan etmək üçün yeni qısa sintaksis istifadə edə bilərsiniz. Bu boş təqlərə bənzəyir:
100100

101101
```jsx{4,7}
102102
class Columns extends React.Component {
@@ -111,20 +111,20 @@ class Columns extends React.Component {
111111
}
112112
```
113113

114-
You can use `<></>` the same way you'd use any other element except that it doesn't support keys or attributes.
114+
Siz `<></>` digər elementləri işlətdiyiniz üsulla istifadə edə bilərsiniz, yalnız bu açarları və atributları dəstəkləmir.
115115

116-
Note that **[many tools don't support it yet](/blog/2017/11/28/react-v16.2.0-fragment-support.html#support-for-fragment-syntax)** so you might want to explicitly write `<React.Fragment>` until the tooling catches up.
116+
Nəzərə alın ki, **[çox alətlər hələki bunu dəstəkləmir](/blog/2017/11/28/react-v16.2.0-fragment-support.html#support-for-fragment-syntax)**. Beləliklə, siz `<React.Fragment>` açıq şəkildə alətlər dəstəkləyənə qədər yazmaq istəyə bilərsiniz.
117117

118-
### Keyed Fragments {#keyed-fragments}
118+
### Açarlı Fraqmentlər {#keyed-fragments}
119119

120-
Fragments declared with the explicit `<React.Fragment>` syntax may have keys. A use case for this is mapping a collection to an array of fragments -- for example, to create a description list:
120+
Açıq `<React.Fragment>` sintaksisi ilə bəyan olunmuş fraqmentlərin açarları ola bilər. Buna misal kolleksiyanın fraqmentlər massivi ilə uzlaşdırılması ola bilər -- məsələn, təsvir siyahısının yaratmaq:
121121

122122
```jsx
123123
function Glossary(props) {
124124
return (
125125
<dl>
126126
{props.items.map(item => (
127-
// Without the `key`, React will fire a key warning
127+
// `key`-siz React açar xəbərdarlığı göndərəcək
128128
<React.Fragment key={item.id}>
129129
<dt>{item.term}</dt>
130130
<dd>{item.description}</dd>
@@ -135,8 +135,8 @@ function Glossary(props) {
135135
}
136136
```
137137

138-
`key` is the only attribute that can be passed to `Fragment`. In the future, we may add support for additional attributes, such as event handlers.
138+
`key` tək atributdur ki, `Fragment`-ə ötürülə bilər. Gələcəkdə biz dəstək üçün hadisə işləyiciləri kimi əlavə atributlar əlavə edə bilərik.
139139

140140
### Live Demo {#live-demo}
141141

142-
You can try out the new JSX fragment syntax with this [CodePen](https://codepen.io/reactjs/pen/VrEbjE?editors=1000).
142+
Siz yeni JSX fraqment sintaksisini [CodePen](https://codepen.io/reactjs/pen/VrEbjE?editors=1000) ilə yoxlaya bilərsiniz.

0 commit comments

Comments
 (0)