Skip to content

Commit

Permalink
add Event System doc Chinese translation
Browse files Browse the repository at this point in the history
  • Loading branch information
minwe committed Dec 18, 2014
1 parent 60ffe1e commit 3095079
Showing 1 changed file with 194 additions and 0 deletions.
194 changes: 194 additions & 0 deletions docs/docs/ref-05-events.zh-CN.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,194 @@
---
id: events-zh-CN
title: 事件系统
permalink: events-zh-CN.html
prev: tags-and-attributes-zh-CN.html
next: dom-differences-zh-CN.html
---

## 合成事件

事件处理程序通过 `合成事件``SyntheticEvent`)的实例传递,`SyntheticEvent` 是浏览器原生事件跨浏览器的封装。`SyntheticEvent` 和浏览器原生事件一样有 `stopPropagation()``preventDefault()` 接口,而且这些接口夸浏览器兼容。

如果出于某些原因想使用浏览器原生事件,可以使用 `nativeEvent` 属性获取。每个和成事件(`SyntheticEvent`)对象都有以下属性:

```javascript
boolean bubbles
boolean cancelable
DOMEventTarget currentTarget
boolean defaultPrevented
Number eventPhase
boolean isTrusted
DOMEvent nativeEvent
void preventDefault()
void stopPropagation()
DOMEventTarget target
Date timeStamp
String type
```

> 注意:
>
> React v0.12 中,事件处理程序返回 `false` 不再停止事件传播,取而代之,应该根据需要手动触发 `e.stopPropagation()``e.preventDefault()`

## 支持的事件

React 将事件统一化,使事件在不同浏览器上有一致的属性。

下面的事件处理程序在事件冒泡阶段被触发。如果要注册事件捕获处理程序,应该使用 `Capture` 事件,例如使用 `onClickCapture` 处理点击事件的捕获阶段,而不是 `onClick`


### 剪贴板事件

事件名称:

```
onCopy onCut onPaste
```

属性:

```javascript
DOMDataTransfer clipboardData
```


### 键盘事件

事件名称:

```
onKeyDown onKeyPress onKeyUp
```

属性:

```javascript
boolean altKey
Number charCode
boolean ctrlKey
function getModifierState(key)
String key
Number keyCode
String locale
Number location
boolean metaKey
boolean repeat
boolean shiftKey
Number which
```


### 焦点事件

事件名称

```
onFocus onBlur
```

属性:

```javascript
DOMEventTarget relatedTarget
```


### 表单事件

事件名称:

```
onChange onInput onSubmit
```

关于 `onChange` 事件的更多信息,参见 [表单组件](/react/docs/forms-zh-CN.html)。


### 鼠标事件

事件名称:

```
onClick onDoubleClick onDrag onDragEnd onDragEnter onDragExit onDragLeave
onDragOver onDragStart onDrop onMouseDown onMouseEnter onMouseLeave
onMouseMove onMouseOut onMouseOver onMouseUp
```

属性:

```javascript
boolean altKey
Number button
Number buttons
Number clientX
Number clientY
boolean ctrlKey
function getModifierState(key)
boolean metaKey
Number pageX
Number pageY
DOMEventTarget relatedTarget
Number screenX
Number screenY
boolean shiftKey
```


### 触控事件

在渲染任意组件之前调用 `React.initializeTouchEvents(true)`,以启用触控事件。

事件名称:

```
onTouchCancel onTouchEnd onTouchMove onTouchStart
```

属性:

```javascript
boolean altKey
DOMTouchList changedTouches
boolean ctrlKey
function getModifierState(key)
boolean metaKey
boolean shiftKey
DOMTouchList targetTouches
DOMTouchList touches
```


### 用户界面事件

事件名称:

```
onScroll
```

属性:

```javascript
Number detail
DOMAbstractView view
```


### 滚轮事件

事件名称:

```
onWheel
```

属性:

```javascript
Number deltaMode
Number deltaX
Number deltaY
Number deltaZ
```

0 comments on commit 3095079

Please sign in to comment.