2014年11月2日 星期日

上層元件往子元件做資料傳遞


假設資料的異動都是在最上層元件
透過state的變化,取得最新的state所帶資料
再做render更新元件顯示

最上層元件在render程序內,由state取得的資料
設定到子元件的屬性上
子元件即可透過props來取得

父元件
var MyPage = React.createClass({
  ender: function() { 
    return (
      <div className="myPage">
        <MyList data={this.state.data}/>          
      </div>         
    );

  }
})
子元件
var MyList = React.createClass({
  render: function() {
    var _this = this
    return (      
      <div className="myList">
        {this.props.data.map(function(item) {
          return <MyItem key={item._id} data={item} />                 
        })}
      </div>
    );
  }
});

沒有留言: