Update parent/child communication tip
petehunt committed
Dec 30, 2013 at 13:22 UTC
47fe931549b7999f3b0702848b7ff0a2bb0a88b8
1 file changed
+4
-2
docs/tips/14-communicate-between-components.md
+4
-2
@@ -18,7 +18,7 @@ var GroceryList = React.createClass({
18
handleClick: function(i) {
19
console.log('You clicked: ' + this.props.items[i]);
20
},
21
-
21
+
22
render: function() {
23
return (
24
<div>
@@ -26,7 +26,7 @@ var GroceryList = React.createClass({
26
return (
27
<div onClick={this.handleClick.bind(this, i)} key={i}>{item}</div>
28
);
29
- }, this)}
29
+ }, this)}
30
</div>
31
);
32
}
@@ -38,3 +38,5 @@ React.renderComponent(
38
```
39
40
Notice the use of `bind(this, arg1, arg2, ...)`: we're simply passing more arguments to `handleClick`. This is not a new React concept; it's just JavaScript.
41
+
42
+For communication between two components that don't have a parent-child relationship, you can set up your own global event system. Subscribe to events in `componentDidMount()`, unsubscribe in `componentWillUnmount()`, and when you receive an event call `setState()`.