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/uncontrolled-components.md
+15-15Lines changed: 15 additions & 15 deletions
Original file line number
Diff line number
Diff line change
@@ -1,14 +1,14 @@
1
1
---
2
2
id: uncontrolled-components
3
-
title: Uncontrolled Components
3
+
title: Kontrolsüz Bileşenler
4
4
permalink: docs/uncontrolled-components.html
5
5
---
6
6
7
-
In most cases, we recommend using [controlled components](/docs/forms.html)to implement forms. In a controlled component, form data is handled by a React component. The alternative is uncontrolled components, where form data is handled by the DOM itself.
7
+
Çoğu durumda, formları uygulamak için [kontrollü bileşenler](/docs/forms.html)kullanmanızı öneririz. Kontrollü bir bileşende, form verileri bir React bileşeni tarafından ele alınır. Alternatifi ise, form verilerinin DOM'un kendisi tarafından işlendiği kontrolsüz bileşenlerdir.
8
8
9
-
To write an uncontrolled component, instead of writing an event handler for every state update, you can [use a ref](/docs/refs-and-the-dom.html) to get form values from the DOM.
9
+
Bir kontrolsüz bileşen yazmak için, her state güncellemesine bir olay yöneticisi yazmak yerine, form verilerini DOM üzerinden getirmek için [ref kullanabilirsiniz](/docs/refs-and-the-dom.html).
10
10
11
-
For example, this code accepts a single name in an uncontrolled component:
11
+
Örneğin, bu kod kontrolsüz bir bileşende tek bir isim kabul eder:
12
12
13
13
```javascript{5,9,18}
14
14
class NameForm extends React.Component {
@@ -37,15 +37,15 @@ class NameForm extends React.Component {
37
37
}
38
38
```
39
39
40
-
[**Try it on CodePen**](https://codepen.io/gaearon/pen/WooRWa?editors=0010)
Since an uncontrolled component keeps the source of truth in the DOM, it is sometimes easier to integrate React and non-React code when using uncontrolled components. It can also be slightly less code if you want to be quick and dirty. Otherwise, you should usually use controlled components.
42
+
Kontrolsüz bir bileşen DOM üzerinde gerçeğin kaynağını koruduğundan, kontrolsüz bileşenleri kullanırken React ve React olmayan kodu entegre etmek bazen daha kolaydır. Ayrıca hızlı ve özensiz olmak istiyorsanız bu biraz daha az kod olabilir. Aksi takdirde, genellikle kontrollü bileşenler kullanmalısınız.
43
43
44
-
If it's still not clear which type of component you should use for a particular situation, you might find [this article on controlled versus uncontrolled inputs](https://goshakkk.name/controlled-vs-uncontrolled-inputs-react/) to be helpful.
44
+
Eğer henüz belirli bir durum için hangi bileşen tipini kullanmanız gerektiğini bilmiyorsanız, [kontrollü ve kontrolsüz input'lara ilişkin bu makale](https://goshakkk.name/controlled-vs-uncontrolled-inputs-react/)yi faydalı bulabilirsiniz.
45
45
46
-
### Default Values {#default-values}
46
+
### Varsayılan Değerler {#default-values}
47
47
48
-
In the React rendering lifecycle, the `value`attribute on form elements will override the value in the DOM. With an uncontrolled component, you often want React to specify the initial value, but leave subsequent updates uncontrolled. To handle this case, you can specify a `defaultValue`attribute instead of `value`.
48
+
React render etme yaşam döngüsünde, form elemanlarında bulunan `value`niteliği, DOM içindeki değeri geçersiz kılar. Kontrolsüz bir bileşen ile, React'in başlangıç değerini belirlemesini isteyebilir, ancak sonraki güncellemeleri kontrolsüz bırakmak isteyebilirsiniz. Bu durumda, `value` yerine `defaultValue`niteliğini belirtebilirsiniz.
49
49
50
50
```javascript{7}
51
51
render() {
@@ -64,21 +64,21 @@ render() {
64
64
}
65
65
```
66
66
67
-
Likewise, `<input type="checkbox">`and`<input type="radio">`support `defaultChecked`, and `<select>`and`<textarea>`supports`defaultValue`.
67
+
Aynı şekilde, `<input type="checkbox">`ve`<input type="radio">``defaultChecked` niteliğini destekler, `<select>`ve`<textarea>`ise`defaultValue` niteliğini destekler.
68
68
69
-
## The file input Tag {#the-file-input-tag}
69
+
## Dosya input etiketi {#the-file-input-tag}
70
70
71
-
In HTML, an `<input type="file">`lets the user choose one or more files from their device storage to be uploaded to a server or manipulated by JavaScript via the [File API](https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications).
71
+
HTML'de, `<input type="file">`kullanıcının cihaz belleği üzerinden bir sunucuya yükleneceği veya JavaScript tarafından [File API](https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications) ile değiştirebileceği bir veya daha fazla dosya seçmesini sağlar.
72
72
73
73
```html
74
74
<inputtype="file" />
75
75
```
76
76
77
-
In React, an `<input type="file" />`is always an uncontrolled component because its value can only be set by a user, and not programmatically.
77
+
React'de, `<input type="file" />`her zaman kontrolsüz bir bileşendir, çünkü değeri yalnızca bir kullanıcı tarafından ayarlanabilir, programlanabilir bir biçimde olamaz.
78
78
79
-
You should use the File API to interact with the files. The following example shows how to create a [ref to the DOM node](/docs/refs-and-the-dom.html) to access file(s) in a submit handler:
79
+
Dosyalarla etkileşimde bulunmak için File API'ını kullanmalısınız. Aşağıdaki örnek, bir gönderme yöneticisi üzerinde bulunan dosyalara erişmek için [DOM node'una bir ref'in nasıl oluşturulacağı](/docs/refs-and-the-dom.html)nı gösterir:
0 commit comments