Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Translate Synthetic Event page #36

Merged
merged 2 commits into from Mar 5, 2019
Merged

Translate Synthetic Event page #36

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
9223346
Add 'reference-events.md' translations
Mar 5, 2019
e1efdb6
Add more translations for `reference-events.md`
Mar 5, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
150 changes: 75 additions & 75 deletions content/docs/reference-events.md
View file
Open in desktop
Expand Up @@ -6,13 +6,13 @@ layout: docs
category: Reference
---

This reference guide documents the `SyntheticEvent` wrapper that forms part of React's Event System. See the [Handling Events](/docs/handling-events.html) guide to learn more.
Bu başvuru rehberinde, React Olay Sistemi'nin bir parçasını oluşturan `SyntheticEvent` sarmalayıcısı(wrapper) açıklanmaktadır. Daha fazla bigli sahibi olmak için [Olay Yönetimi](/docs/handling-events.html) kaynağını inceleyebilirsiniz.

## Overview {#overview}
## Genel Bakış {#overview}

Your event handlers will be passed instances of `SyntheticEvent`, a cross-browser wrapper around the browser's native event. It has the same interface as the browser's native event, including `stopPropagation()` and `preventDefault()`, except the events work identically across all browsers.
Olay yöneticilerinize, tarayıcının kendi olaylarını sarmalayan bir çapraz-tarayıcı `SyntheticEvent` nesnesi iletilir. Bu nesne tüm tarayıcılarda aynı şekilde çalışması dışında, `stopPropagation()` ve `preventDefault()` dahil olmak üzere, tarayıcının kendi olayıyla aynı arabirime sahiptir.

If you find that you need the underlying browser event for some reason, simply use the `nativeEvent` attribute to get it. Every `SyntheticEvent` object has the following attributes:
Bir nedenden ötürü esas tarayıcı olayına ihtiyaç duyarsanız, basitçe `nativeEvent` özelliğini kullanın. Her `SyntheticEvent` nesnesi aşağıdaki özelliklere sahiptir:

```javascript
boolean bubbles
Expand All @@ -31,15 +31,13 @@ number timeStamp
string type
```

> Note:
> Not:
>
> As of v0.14, returning `false` from an event handler will no longer stop event propagation. Instead, `e.stopPropagation()` or `e.preventDefault()` should be triggered manually, as appropriate.
> v0.14 itibariyle, bir olay yöneticisinden `false` döndürmek artık olay yayılımını durdurmayacaktır. Bunun yerine, uygun görüldüğü şekilde `e.stopPropagation()` ya da `e.preventDefault()` manuel olarak tetiklenmelidir.

### Event Pooling {#event-pooling}
### Olay Ortaklama (Event Pooling) {#event-pooling}

The `SyntheticEvent` is pooled. This means that the `SyntheticEvent` object will be reused and all properties will be nullified after the event callback has been invoked.
This is for performance reasons.
As such, you cannot access the event in an asynchronous way.
`SyntheticEvent` ortaklanmıştır. Bu, `SyntheticEvent` nesnesinin tekrar kullanılacağı ve olay geri dönmesinin(callback) çağırılması durumunda tüm özelliklerinin sıfırlanacağı anlamına gelmektedir. Bu durum performans sebeplerinden kaynaklanmaktadır. Böyle olunca da, olaya asenkron bir şekilde erişmeniz mümkün değildir.

```javascript
function onClick(event) {
Expand All @@ -60,62 +58,62 @@ function onClick(event) {
}
```

> Note:
> Not:
>
> If you want to access the event properties in an asynchronous way, you should call `event.persist()` on the event, which will remove the synthetic event from the pool and allow references to the event to be retained by user code.

## Supported Events {#supported-events}

React normalizes events so that they have consistent properties across different browsers.

The event handlers below are triggered by an event in the bubbling phase. To register an event handler for the capture phase, append `Capture` to the event name; for example, instead of using `onClick`, you would use `onClickCapture` to handle the click event in the capture phase.

- [Clipboard Events](#clipboard-events)
- [Composition Events](#composition-events)
- [Keyboard Events](#keyboard-events)
- [Focus Events](#focus-events)
- [Form Events](#form-events)
- [Mouse Events](#mouse-events)
- [Pointer Events](#pointer-events)
- [Selection Events](#selection-events)
- [Touch Events](#touch-events)
- [UI Events](#ui-events)
- [Wheel Events](#wheel-events)
- [Media Events](#media-events)
- [Image Events](#image-events)
- [Animation Events](#animation-events)
- [Transition Events](#transition-events)
- [Other Events](#other-events)
> Olay özelliklerine asenkron bir şekilde erişmek isterseniz, olay üzerinde `event.persist()` çağırmalısınız. Bu şekilde sentetik olay havuzdan çıkarılır ve olay referanslarının kullanıcı kodu tarafından korunmasına olanak sağlanır.

## Desteklenen Olaylar {#supported-events}

React olayları normalleştirir ve olaylar bu şekilde farklı tarayıcılarda tutarlı özelliklere sahip olur.

Aşağıdaki olay yöneticileri, balonlanma(bubbling) evresinde bir olay tarafından tetiklenir. Yakalama evresine bir olay yöneticisi kaydetmek için, olay ismine `Capture` ilave edin. Örneğin tıklama olayını, yakalama evresinde yönetmek için `onClick` kullanmak yerine `onClickCapture` kullanın.

- [Not Panosu Olayları](#clipboard-events)
- [Dizim Olayları](#composition-events)
helloanil marked this conversation as resolved.
Show resolved Hide resolved
- [Klavye Olayları](#keyboard-events)
- [Odaklanma Olayları](#focus-events)
- [Form Olayları](#form-events)
- [Fare Olayları](#mouse-events)
- [İşaretçi Olayları](#pointer-events)
- [Seçme Olayları](#selection-events)
- [Dokunma Olayları](#touch-events)
- [Kullanıcı Arayüzü Olayları](#ui-events)
- [Tekerlek Olayları](#wheel-events)
- [Medya Olayları](#media-events)
- [Resim Olayları](#image-events)
- [Animasyon Olayları](#animation-events)
- [Geciş Olayları](#transition-events)
- [Diğer Olaylar](#other-events)

* * *

## Reference {#reference}
## Kaynak {#reference}

### Clipboard Events {#clipboard-events}
### Not Panosu Olayları {#clipboard-events}

Event names:
Olay isimleri:

```
onCopy onCut onPaste
```

Properties:
Özellikler:

```javascript
DOMDataTransfer clipboardData
```

* * *

### Composition Events {#composition-events}
### Dizim Olayları {#composition-events}

Event names:
Olay isimleri:

```
onCompositionEnd onCompositionStart onCompositionUpdate
```

Properties:
Özellikler:

```javascript
string data
Expand All @@ -124,15 +122,15 @@ string data

* * *

### Keyboard Events {#keyboard-events}
### Klavye Olayları {#keyboard-events}

Event names:
Olay isimleri:

```
onKeyDown onKeyPress onKeyUp
```

Properties:
Özellikler:

```javascript
boolean altKey
Expand All @@ -149,43 +147,43 @@ boolean shiftKey
number which
```

The `key` property can take any of the values documented in the [DOM Level 3 Events spec](https://www.w3.org/TR/uievents-key/#named-key-attribute-values).
`key` özelliği [DOM Level 3 Events spec](https://www.w3.org/TR/uievents-key/#named-key-attribute-values)'de belgelenen tüm değerleri alabilir.

* * *

### Focus Events {#focus-events}
### Odaklanma Olayları {#focus-events}

Event names:
Olay isimleri:

```
onFocus onBlur
```

These focus events work on all elements in the React DOM, not just form elements.
Bu odaklanma olayları sadece form elemanlarında değil, React DOM'daki tüm elemanlarda çalışmaktadır.

Properties:
Özellikler:

```javascript
DOMEventTarget relatedTarget
```

* * *

### Form Events {#form-events}
### Form Olayları {#form-events}

Event names:
Olay isimleri:

```
onChange onInput onInvalid onSubmit
```

For more information about the onChange event, see [Forms](/docs/forms.html).
onChage olayı ile ilgili daha fazla bilgi için [Formlar](/docs/forms.html)'ı inceleyin.

* * *

### Mouse Events {#mouse-events}
### Fare Olayları {#mouse-events}

Event names:
Olay isimleri:

```
onClick onContextMenu onDoubleClick onDrag onDragEnd onDragEnter onDragExit
Expand All @@ -195,7 +193,7 @@ onMouseMove onMouseOut onMouseOver onMouseUp

The `onMouseEnter` and `onMouseLeave` events propagate from the element being left to the one being entered instead of ordinary bubbling and do not have a capture phase.
helloanil marked this conversation as resolved.
Show resolved Hide resolved

Properties:
Özellikler:

```javascript
boolean altKey
Expand All @@ -216,9 +214,9 @@ boolean shiftKey

* * *

### Pointer Events {#pointer-events}
### İşaretçi Olayları {#pointer-events}

Event names:
Olay isimleri:

```
onPointerDown onPointerMove onPointerUp onPointerCancel onGotPointerCapture
Expand All @@ -227,9 +225,9 @@ onLostPointerCapture onPointerEnter onPointerLeave onPointerOver onPointerOut

The `onPointerEnter` and `onPointerLeave` events propagate from the element being left to the one being entered instead of ordinary bubbling and do not have a capture phase.
helloanil marked this conversation as resolved.
Show resolved Hide resolved

Properties:
Özellikler:

As defined in the [W3 spec](https://www.w3.org/TR/pointerevents/), pointer events extend [Mouse Events](#mouse-events) with the following properties:
[W3 spec](https://www.w3.org/TR/pointerevents/)'te tanımlandığı üzere, işaretçi olayları [Fare Olayları](#mouse-events)'nı aşağıdaki özellikler ile genişletir.

```javascript
number pointerId
Expand All @@ -244,7 +242,9 @@ string pointerType
boolean isPrimary
```

A note on cross-browser support:
Çapraz-tarayıcı desteği üzerine bir not:

İşaretçi olayları henüz tüm tarayıcılarda desteklenmemektedir (Bu makalenin yazıldığı tarihte destekleyen tarayıcılar: Chrome, Firefox, Edge ve Internet Explorer). React kasıtlı olarak

Pointer events are not yet supported in every browser (at the time of writing this article, supported browsers include: Chrome, Firefox, Edge, and Internet Explorer). React deliberately does not polyfill support for other browsers because a standard-conform polyfill would significantly increase the bundle size of `react-dom`.
helloanil marked this conversation as resolved.
Show resolved Hide resolved

Expand All @@ -254,7 +254,7 @@ If your application requires pointer events, we recommend adding a third party p

### Selection Events {#selection-events}

Event names:
Olay isimleri:

```
onSelect
Expand All @@ -264,13 +264,13 @@ onSelect

### Touch Events {#touch-events}

Event names:
Olay isimleri:

```
onTouchCancel onTouchEnd onTouchMove onTouchStart
```

Properties:
Özellikler:

```javascript
boolean altKey
Expand All @@ -287,13 +287,13 @@ DOMTouchList touches

### UI Events {#ui-events}

Event names:
Olay isimleri:

```
onScroll
```

Properties:
Özellikler:

```javascript
number detail
Expand All @@ -304,13 +304,13 @@ DOMAbstractView view

### Wheel Events {#wheel-events}

Event names:
Olay isimleri:

```
onWheel
```

Properties:
Özellikler:

```javascript
number deltaMode
Expand All @@ -323,7 +323,7 @@ number deltaZ

### Media Events {#media-events}

Event names:
Olay isimleri:

```
onAbort onCanPlay onCanPlayThrough onDurationChange onEmptied onEncrypted
Expand All @@ -336,7 +336,7 @@ onTimeUpdate onVolumeChange onWaiting

### Image Events {#image-events}

Event names:
Olay isimleri:

```
onLoad onError
Expand All @@ -346,13 +346,13 @@ onLoad onError

### Animation Events {#animation-events}

Event names:
Olay isimleri:

```
onAnimationStart onAnimationEnd onAnimationIteration
```

Properties:
Özellikler:

```javascript
string animationName
Expand All @@ -364,13 +364,13 @@ float elapsedTime

### Transition Events {#transition-events}

Event names:
Olay isimleri:

```
onTransitionEnd
```

Properties:
Özellikler:

```javascript
string propertyName
Expand All @@ -382,7 +382,7 @@ float elapsedTime

### Other Events {#other-events}

Event names:
Olay isimleri:

```
onToggle
Expand Down