@samitouri / QOS-React-2 / commits / 309507955b

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 +```