Skip to content

Commit 6c2a624

Browse files
committed
translate synthetic events
1 parent 0e508b9 commit 6c2a624

File tree

1 file changed

+72
-72
lines changed

1 file changed

+72
-72
lines changed

content/docs/reference-events.md

Lines changed: 72 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
---
22
id: events
3-
title: 合成 (Synthetic) イベント
3+
title: 合成イベント (SyntheticEvent)
44
permalink: docs/events.html
55
layout: docs
66
category: Reference
77
---
88

9-
このリファレンスガイドは、React イベントシステムの一部を構成する `SyntheticEvent` (合成イベント)ラッパーについて文書化したものです。詳しくは[イベント処理](/docs/handling-events.html)を参照してください
9+
このリファレンスガイドでは、React イベントシステムの一部を構成する `SyntheticEvent`合成イベント)ラッパについて説明します。詳細については[イベント処理](/docs/handling-events.html)ガイドを参照してください
1010

1111
## 概要
1212

13-
イベントハンドラには `SyntheticEvent` のインスタンスが渡されます。これはブラウザのネイティブイベントのクロスブラウザラッパーです`stopPropagation()` `preventDefault()` など、ブラウザのネイティブイベントと同じインターフェイスを持ちます。これらはすべてのブラウザで同じように機能します
13+
あなたの書くイベントハンドラには、 `SyntheticEvent` のインスタンスが渡されます。これはブラウザのネイティブイベントに対するクロスブラウザ版のラッパです`stopPropagation()` `preventDefault()` を含む、ブラウザのネイティブイベントと同じインターフェイスを持ちます。この 2つ以外はすべてのブラウザで同じように機能します
1414

15-
何らかの理由で基本的なブラウザイベントが必要であることがわかった場合は、`nativeEvent` 属性を使用して取得してください。すべての `SyntheticEvent` オブジェクトには以下の属性があります
15+
何らかの理由で実際のブラウザイベントが必要な場合は、単に `nativeEvent` 属性を使用するだけで取得できます。すべての `SyntheticEvent` オブジェクトは以下の属性を持っています
1616

1717
```javascript
1818
boolean bubbles
@@ -33,16 +33,16 @@ string type
3333

3434
> 補足
3535
>
36-
> v0.14以降、イベントハンドラからfalseを返してもイベントの伝播が止まることはなくなりました。代わりに、`e.stopPropagation()` または `e.preventDefault()` を手動でトリガーする必要があります
36+
> v0.14以降、イベントハンドラから false を返してもイベントの伝播が止まることはなくなりました。代わりに、`e.stopPropagation()` または `e.preventDefault()` を手動で呼び出す必要があります
3737
3838

39-
### イベントプーリング
39+
### イベントのプール
4040

41-
`SyntheticEvent` はプールされます。つまり、`SyntheticEvent` オブジェクトは再利用され、イベントコールバックが呼び出された後にすべてのプロパティは無効になります。これはパフォーマンス上の理由からです。そのため、非同期にイベントにアクセスすることはできません
41+
`SyntheticEvent` はプールされます。つまり、`SyntheticEvent` オブジェクトは再利用され、すべてのプロパティはイベントコールバックが呼び出された後に無効化されます。これはパフォーマンス上の理由からです。そのため、非同期的な方法でイベントにアクセスすることはできません
4242

4343
```javascript
4444
function onClick(event) {
45-
console.log(event); // => nullified object.
45+
console.log(event); // => 無効なオブジェクト
4646
console.log(event.type); // => "click"
4747
const eventType = event.type; // => "click"
4848

@@ -51,7 +51,7 @@ function onClick(event) {
5151
console.log(eventType); // => "click"
5252
}, 0);
5353

54-
// これは動作しません。this.state.clickEvent はnullのみを保持します
54+
// これは動作しません。this.state.clickEvent はnull値のみを保持します
5555
this.setState({clickEvent: event});
5656

5757
// イベントプロパティをエクスポートすることは可能です。
@@ -62,14 +62,14 @@ function onClick(event) {
6262

6363
> 補足
6464
>
65-
> 非同期でイベントプロパティにアクセスする場合は、イベントに対して `event.persist()` を呼び出す必要があります。これにより、プールから合成イベントが削除され、イベントへの参照をコードで保持できるようになります。
65+
> 非同期処理でイベントのプロパティにアクセスしたい場合は、`event.persist()` をイベント内で呼び出す必要があります。これにより、プールから合成イベントが削除され、イベントへの参照をコードで保持できるようになります。
6666
6767

68-
## サポートされるイベント
68+
## サポートするイベント
6969

70-
React はイベントを正規化して、異なるブラウザ間で一貫したプロパティを持つようにします
70+
React はイベントを正規化して、異なるブラウザ間で一貫したプロパティが保持されるようにしています
7171

72-
以下のイベントハンドラはバブリングフェーズのイベントによって発生します。キャプチャフェーズのイベントハンドラを登録するには、イベント名に `Capture` を追加します。たとえば、`onClick` を使用する代わりに、`onClickCapture` を使用してキャプチャフェーズでクリックイベントを処理します
72+
以下のイベントハンドラはイベント伝搬のバブリングフェーズで呼び出されます。キャプチャフェーズのイベントハンドラを登録するには、イベント名に `Capture` を追加します。たとえば、`onClick` の代わりに `onClickCapture` を使用して、キャプチャフェーズでクリックイベントを処理します
7373

7474
- [クリップボードイベント](#clipboard-events)
7575
- [コンポジションイベント](#composition-events)
@@ -81,43 +81,43 @@ React はイベントを正規化して、異なるブラウザ間で一貫し
8181
- [選択イベント](#selection-events)
8282
- [タッチイベント](#touch-events)
8383
- [UI イベント](#ui-events)
84-
- [Wheel Events](#wheel-events)
85-
- [Media Events](#media-events)
86-
- [Image Events](#image-events)
87-
- [Animation Events](#animation-events)
88-
- [Transition Events](#transition-events)
89-
- [Other Events](#other-events)
84+
- [ホイールイベント](#wheel-events)
85+
- [メディアイベント](#media-events)
86+
- [画像イベント](#image-events)
87+
- [アニメーションイベント](#animation-events)
88+
- [遷移イベント](#transition-events)
89+
- [その他のイベント](#other-events)
9090

9191

9292
* * *
9393

94-
## Reference
94+
## リファレンス
9595

96-
### Clipboard Events
96+
### クリップボードイベント
9797

98-
Event names:
98+
イベント名:
9999

100100
```
101101
onCopy onCut onPaste
102102
```
103103

104-
Properties:
104+
プロパティ:
105105

106106
```javascript
107107
DOMDataTransfer clipboardData
108108
```
109109

110110
* * *
111111

112-
### Composition Events
112+
### コンポジションイベント
113113

114-
Event names:
114+
イベント名:
115115

116116
```
117117
onCompositionEnd onCompositionStart onCompositionUpdate
118118
```
119119

120-
Properties:
120+
プロパティ:
121121

122122
```javascript
123123
string data
@@ -126,15 +126,15 @@ string data
126126

127127
* * *
128128

129-
### Keyboard Events
129+
### キーボードイベント
130130

131-
Event names:
131+
イベント名:
132132

133133
```
134134
onKeyDown onKeyPress onKeyUp
135135
```
136136

137-
Properties:
137+
プロパティ:
138138

139139
```javascript
140140
boolean altKey
@@ -151,53 +151,53 @@ boolean shiftKey
151151
number which
152152
```
153153

154-
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).
154+
`key` プロパティは[DOM Level 3 Events spec](https://www.w3.org/TR/uievents-key/#named-key-attribute-values)に記載されている任意の値を取ることができます。
155155

156156
* * *
157157

158-
### Focus Events
158+
### フォーカスイベント
159159

160-
Event names:
160+
イベント名:
161161

162162
```
163163
onFocus onBlur
164164
```
165165

166-
These focus events work on all elements in the React DOM, not just form elements.
166+
これらのフォーカスイベントは、フォーム要素だけでなくすべての React DOM 要素で動作します。
167167

168-
Properties:
168+
プロパティ:
169169

170170
```javascript
171171
DOMEventTarget relatedTarget
172172
```
173173

174174
* * *
175175

176-
### Form Events
176+
### フォームイベント
177177

178-
Event names:
178+
イベント名:
179179

180180
```
181181
onChange onInput onInvalid onSubmit
182182
```
183183

184-
For more information about the onChange event, see [Forms](/docs/forms.html).
184+
onChange イベントの詳細については、[Forms](/docs/forms.html)を参照してください。
185185

186186
* * *
187187

188-
### Mouse Events
188+
### マウスイベント
189189

190-
Event names:
190+
イベント名:
191191

192192
```
193193
onClick onContextMenu onDoubleClick onDrag onDragEnd onDragEnter onDragExit
194194
onDragLeave onDragOver onDragStart onDrop onMouseDown onMouseEnter onMouseLeave
195195
onMouseMove onMouseOut onMouseOver onMouseUp
196196
```
197197

198-
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.
198+
`onMouseEnter` `onMouseLeave` イベントは通常のバブリングとは異なり、(ポインタが)出て行った要素から入ってきた要素に伝播し、キャプチャフェーズを持ちません。
199199

200-
Properties:
200+
プロパティ:
201201

202202
```javascript
203203
boolean altKey
@@ -218,20 +218,20 @@ boolean shiftKey
218218

219219
* * *
220220

221-
### Pointer Events
221+
### ポインタイベント
222222

223-
Event names:
223+
イベント名:
224224

225225
```
226226
onPointerDown onPointerMove onPointerUp onPointerCancel onGotPointerCapture
227227
onLostPointerCapture onPointerEnter onPointerLeave onPointerOver onPointerOut
228228
```
229229

230-
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.
230+
`onPointerEnter` `onPointerLeave` イベントは通常のバブリングとは異なり、(ポインタが)出て行った要素から入ってきた要素に伝播し、キャプチャフェーズを持ちません。
231231

232-
Properties:
232+
プロパティ:
233233

234-
As defined in the [W3 spec](https://www.w3.org/TR/pointerevents/), pointer events extend [Mouse Events](#mouse-events) with the following properties:
234+
[W3 spec](https://www.w3.org/TR/pointerevents/)に定義されている通り、ポインタイベントは下記のプロパティを持つマウスイベントの拡張です。
235235

236236
```javascript
237237
number pointerId
@@ -246,33 +246,33 @@ string pointerType
246246
boolean isPrimary
247247
```
248248

249-
A note on cross-browser support:
249+
クロスブラウザサポートについての補足:
250250

251-
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`.
251+
すべてのブラウザでポインタイベントがサポートされているわけではありません(この記事の執筆時点でサポートされているブラウザは、ChromeFirefoxEdge、および Internet Explorer です)。標準に準拠したポリフィルは `react-dom` のバンドルサイズを大幅に増加させるため、Reactは意図的に他のブラウザのポリフィルをサポートしません。
252252

253-
If your application requires pointer events, we recommend adding a third party pointer event polyfill.
253+
アプリケーションでポインタイベントが必要な場合は、サードパーティのポインタイベントポリフィルを追加することをお勧めします。
254254

255255
* * *
256256

257-
### Selection Events
257+
### 選択イベント
258258

259-
Event names:
259+
イベント名:
260260

261261
```
262262
onSelect
263263
```
264264

265265
* * *
266266

267-
### Touch Events
267+
### タッチイベント
268268

269-
Event names:
269+
イベント名:
270270

271271
```
272272
onTouchCancel onTouchEnd onTouchMove onTouchStart
273273
```
274274

275-
Properties:
275+
プロパティ:
276276

277277
```javascript
278278
boolean altKey
@@ -287,15 +287,15 @@ DOMTouchList touches
287287

288288
* * *
289289

290-
### UI Events
290+
### UI イベント
291291

292-
Event names:
292+
イベント名:
293293

294294
```
295295
onScroll
296296
```
297297

298-
Properties:
298+
プロパティ:
299299

300300
```javascript
301301
number detail
@@ -304,15 +304,15 @@ DOMAbstractView view
304304

305305
* * *
306306

307-
### Wheel Events
307+
### ホイールイベント
308308

309-
Event names:
309+
イベント名:
310310

311311
```
312312
onWheel
313313
```
314314

315-
Properties:
315+
プロパティ:
316316

317317
```javascript
318318
number deltaMode
@@ -323,9 +323,9 @@ number deltaZ
323323

324324
* * *
325325

326-
### Media Events
326+
### メディアイベント
327327

328-
Event names:
328+
イベント名:
329329

330330
```
331331
onAbort onCanPlay onCanPlayThrough onDurationChange onEmptied onEncrypted
@@ -336,25 +336,25 @@ onTimeUpdate onVolumeChange onWaiting
336336

337337
* * *
338338

339-
### Image Events
339+
### 画像イベント
340340

341-
Event names:
341+
イベント名:
342342

343343
```
344344
onLoad onError
345345
```
346346

347347
* * *
348348

349-
### Animation Events
349+
### アニメーションイベント
350350

351-
Event names:
351+
イベント名:
352352

353353
```
354354
onAnimationStart onAnimationEnd onAnimationIteration
355355
```
356356

357-
Properties:
357+
プロパティ:
358358

359359
```javascript
360360
string animationName
@@ -364,15 +364,15 @@ float elapsedTime
364364

365365
* * *
366366

367-
### Transition Events
367+
### 遷移イベント
368368

369-
Event names:
369+
イベント名:
370370

371371
```
372372
onTransitionEnd
373373
```
374374

375-
Properties:
375+
プロパティ:
376376

377377
```javascript
378378
string propertyName
@@ -382,9 +382,9 @@ float elapsedTime
382382

383383
* * *
384384

385-
### Other Events
385+
### その他のイベント
386386

387-
Event names:
387+
イベント名:
388388

389389
```
390390
onToggle

0 commit comments

Comments
 (0)