組件間的通信

對(duì)于 父-子 通信，直接 pass props.

對(duì)于 子-父 通信： 例如： GroceryList 組件有一些通過(guò)數(shù)組生成的子節(jié)點(diǎn)。當(dāng)這些節(jié)點(diǎn)被點(diǎn)擊的時(shí)候，你想要展示這個(gè)節(jié)點(diǎn)的名字：

var GroceryList = React.createClass({
  handleClick: function(i) {
    console.log('You clicked: ' + this.props.items[i]);
  },

  render: function() {    return (
      <div>
        {this.props.items.map(function(item, i) {          return (
            <div onClick={this.handleClick.bind(this, i)} key={i}>{item}</div>
          );
        }, this)}
      </div>
    );
  }
});

React.render(
  <GroceryList items={['Apple', 'Banana', 'Cranberry']} />, mountNode
);

注意 bind(this, arg1, arg2, ...) 的使用： 我們通過(guò)它向 handleClick 傳遞參數(shù)。 這不是 React 的新概念，而是 JavaScript 的。

對(duì)于沒(méi)有 父-子 關(guān)系的組件間的通信，你可以設(shè)置你自己的全局時(shí)間系統(tǒng)。 在 componentDidMount() 里訂閱事件，在componentWillUnmount() 里退訂，然后在事件回調(diào)里調(diào)用 setState()。