reactjs - How to handle child component from parent -

i looking useful information how handle parent component child , found piece of code, understand in code except 1 moment. here code

var app = react.createclass({   getinitialstate:function() {     return {       items: [1,2,3,4,5,6,7,8]     }   },    handleclick:function() {     var newitem = this.refs.textref.getdomnode().value;     var newitems = this.state.items.concat([newitem]);     this.setstate({       items: newitems     });     this.refs.textref.getdomnode().value = "";   },    deleteitem:function(item) {     var index = this.state.items.indexof(item);     var newitems = undefined;     if (index > -1) {       this.state.items.splice(index, 1);       newitems = this.state.items;       this.setstate({         items: newitems       })     };   },    render:function() {     var item = this.state.items.map(function(item,i) {       return <subitem key={i} sometext={item} ondelete={this.deleteitem}/>     }.bind(this)); // dont understand     return (<div>               <input ref="textref" type="text"/>               <button onclick={this.handleclick}>click me</button>               {item}             </div>)   } });  var subitem = react.createclass({   handledelete:function() {     this.props.ondelete(this.props.sometext)   },   render:function() {     return  (<ul>               <li onclick={this.handledelete}>{this.props.sometext}</li>             </ul>)   } })  react.render(<app />, document.body) 

and have broken understanding react on part inside handledelete function

handledelete:function() {         this.props.ondelete(this.props.sometext)       }, 

what mean , how work ? fiddle here in advance

you passing child component callback, deleteitem.

the child component, when click, triggers handledelete function, triggers ondelete callback, deleteitem in parent.

this common pattern in react: https://facebook.github.io/react/tips/communicate-between-components.html