Fix broken link, spacing on events tip
Paul O’Shannessy committed
Nov 12, 2013 at 13:11 UTC
0ebd3d92ba6626194984e53fc7de6f0445919318
1 file changed
+6
-2
docs/tips/11-dom-event-listeners.md
+6
-2
@@ -9,7 +9,7 @@ next: initial-ajax.html
9
10
> Note:
11
>
12
-> This entry shows how to attach DOM events not provided by React ([check here for more info](/react/docs/tips/events.html)). This is good for integrations with other libraries such as jQuery.
12
+> This entry shows how to attach DOM events not provided by React ([check here for more info](/react/docs/events.html)). This is good for integrations with other libraries such as jQuery.
13
14
Try to resize the window:
15
@@ -20,15 +20,19 @@ var Box = React.createClass({
20
getInitialState: function() {
21
return {windowWidth: window.innerWidth};
22
},
23
+
24
handleResize: function(e) {
25
this.setState({windowWidth: window.innerWidth});
26
},
27
+
28
componentDidMount: function() {
29
window.addEventListener('resize', this.handleResize);
30
},
31
+
32
componentWillUnmount: function() {
33
window.removeEventListener('resize', this.handleResize);
34
},
35
+
36
render: function() {
37
return <div>Current window width: {this.state.windowWidth}</div>;
38
}
@@ -37,4 +41,4 @@ var Box = React.createClass({
41
React.renderComponent(<Box />, mountNode);
42
```
43
40
-`componentDidMount` is called after the component's mounted and has a DOM representation. This is often a place where you'd attach generic DOM events.
44
+`componentDidMount` is called after the component is mounted and has a DOM representation. This is often a place where you would attach generic DOM events.