Browse Source

Fix broken link, spacing on events tip

main
Paul O’Shannessy 11 years ago
parent
commit
5c8c2b6f7b
  1. 8
      tips/11-dom-event-listeners.md

8
tips/11-dom-event-listeners.md

@ -9,7 +9,7 @@ next: initial-ajax.html
> Note: > Note:
> >
> 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. > 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.
Try to resize the window: Try to resize the window:
@ -20,15 +20,19 @@ var Box = React.createClass({
getInitialState: function() { getInitialState: function() {
return {windowWidth: window.innerWidth}; return {windowWidth: window.innerWidth};
}, },
handleResize: function(e) { handleResize: function(e) {
this.setState({windowWidth: window.innerWidth}); this.setState({windowWidth: window.innerWidth});
}, },
componentDidMount: function() { componentDidMount: function() {
window.addEventListener('resize', this.handleResize); window.addEventListener('resize', this.handleResize);
}, },
componentWillUnmount: function() { componentWillUnmount: function() {
window.removeEventListener('resize', this.handleResize); window.removeEventListener('resize', this.handleResize);
}, },
render: function() { render: function() {
return <div>Current window width: {this.state.windowWidth}</div>; return <div>Current window width: {this.state.windowWidth}</div>;
} }
@ -37,4 +41,4 @@ var Box = React.createClass({
React.renderComponent(<Box />, mountNode); React.renderComponent(<Box />, mountNode);
``` ```
`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. `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.

Loading…
Cancel
Save