add Event System doc Chinese translation
minwe committed
Dec 18, 2014 at 13:10 UTC
309507955b92d89f1caa8130f67e7f3dd4606ee1
1 file changed
+194
docs/docs/ref-05-events.zh-CN.md
new
+194
@@ -0,0 +1,194 @@
1
+---
2
+id: events-zh-CN
3
+title: 事件系统
4
+permalink: events-zh-CN.html
5
+prev: tags-and-attributes-zh-CN.html
6
+next: dom-differences-zh-CN.html
7
+---
8
+
9
+## 合成事件
10
+
11
+事件处理程序通过 `合成事件`(`SyntheticEvent`)的实例传递,`SyntheticEvent` 是浏览器原生事件跨浏览器的封装。`SyntheticEvent` 和浏览器原生事件一样有 `stopPropagation()`、`preventDefault()` 接口,而且这些接口夸浏览器兼容。
12
+
13
+如果出于某些原因想使用浏览器原生事件,可以使用 `nativeEvent` 属性获取。每个和成事件(`SyntheticEvent`)对象都有以下属性:
14
+
15
+```javascript
16
+boolean bubbles
17
+boolean cancelable
18
+DOMEventTarget currentTarget
19
+boolean defaultPrevented
20
+Number eventPhase
21
+boolean isTrusted
22
+DOMEvent nativeEvent
23
+void preventDefault()
24
+void stopPropagation()
25
+DOMEventTarget target
26
+Date timeStamp
27
+String type
28
+```
29
+
30
+> 注意:
31
+>
32
+> React v0.12 中,事件处理程序返回 `false` 不再停止事件传播,取而代之,应该根据需要手动触发 `e.stopPropagation()` 或 `e.preventDefault()`。
33
+
34
+
35
+## 支持的事件
36
+
37
+React 将事件统一化,使事件在不同浏览器上有一致的属性。
38
+
39
+下面的事件处理程序在事件冒泡阶段被触发。如果要注册事件捕获处理程序,应该使用 `Capture` 事件,例如使用 `onClickCapture` 处理点击事件的捕获阶段,而不是 `onClick`。
40
+
41
+
42
+### 剪贴板事件
43
+
44
+事件名称:
45
+
46
+```
47
+onCopy onCut onPaste
48
+```
49
+
50
+属性:
51
+
52
+```javascript
53
+DOMDataTransfer clipboardData
54
+```
55
+
56
+
57
+### 键盘事件
58
+
59
+事件名称:
60
+
61
+```
62
+onKeyDown onKeyPress onKeyUp
63
+```
64
+
65
+属性:
66
+
67
+```javascript
68
+boolean altKey
69
+Number charCode
70
+boolean ctrlKey
71
+function getModifierState(key)
72
+String key
73
+Number keyCode
74
+String locale
75
+Number location
76
+boolean metaKey
77
+boolean repeat
78
+boolean shiftKey
79
+Number which
80
+```
81
+
82
+
83
+### 焦点事件
84
+
85
+事件名称
86
+
87
+```
88
+onFocus onBlur
89
+```
90
+
91
+属性:
92
+
93
+```javascript
94
+DOMEventTarget relatedTarget
95
+```
96
+
97
+
98
+### 表单事件
99
+
100
+事件名称:
101
+
102
+```
103
+onChange onInput onSubmit
104
+```
105
+
106
+关于 `onChange` 事件的更多信息,参见 [表单组件](/react/docs/forms-zh-CN.html)。
107
+
108
+
109
+### 鼠标事件
110
+
111
+事件名称:
112
+
113
+```
114
+onClick onDoubleClick onDrag onDragEnd onDragEnter onDragExit onDragLeave
115
+onDragOver onDragStart onDrop onMouseDown onMouseEnter onMouseLeave
116
+onMouseMove onMouseOut onMouseOver onMouseUp
117
+```
118
+
119
+属性:
120
+
121
+```javascript
122
+boolean altKey
123
+Number button
124
+Number buttons
125
+Number clientX
126
+Number clientY
127
+boolean ctrlKey
128
+function getModifierState(key)
129
+boolean metaKey
130
+Number pageX
131
+Number pageY
132
+DOMEventTarget relatedTarget
133
+Number screenX
134
+Number screenY
135
+boolean shiftKey
136
+```
137
+
138
+
139
+### 触控事件
140
+
141
+在渲染任意组件之前调用 `React.initializeTouchEvents(true)`,以启用触控事件。
142
+
143
+事件名称:
144
+
145
+```
146
+onTouchCancel onTouchEnd onTouchMove onTouchStart
147
+```
148
+
149
+属性:
150
+
151
+```javascript
152
+boolean altKey
153
+DOMTouchList changedTouches
154
+boolean ctrlKey
155
+function getModifierState(key)
156
+boolean metaKey
157
+boolean shiftKey
158
+DOMTouchList targetTouches
159
+DOMTouchList touches
160
+```
161
+
162
+
163
+### 用户界面事件
164
+
165
+事件名称:
166
+
167
+```
168
+onScroll
169
+```
170
+
171
+属性:
172
+
173
+```javascript
174
+Number detail
175
+DOMAbstractView view
176
+```
177
+
178
+
179
+### 滚轮事件
180
+
181
+事件名称:
182
+
183
+```
184
+onWheel
185
+```
186
+
187
+属性:
188
+
189
+```javascript
190
+Number deltaMode
191
+Number deltaX
192
+Number deltaY
193
+Number deltaZ
194
+```