javascript - React how to update another component's state? -
i pretty new react, trying make components work. have
objecta:react.createclass({ proptypes: { ... }, getinitialstate: function() { return { mystate: null } }, updatemystate: function(value) { this.setstate({ mystate: value }) } render: function() { return (<div classname="my-class">'hello' +{this.state.mystate}</div>); } }); objectb:react.createclass({ proptypes: { ... }, render: function() { return (<div classname="my-class"><objecta / > </div>); } });
i'd update objecta's state objectb. how in objectb call objecta's updatemystate method? thanks!
the basic idea of react unidirectional data flow. means data shared downwards ancestor component children via child's properties. leave flux architectures , event emitters out of equation simple example it's not necessary @ all.
the way change component's state outside changing props receives in parent's render method. mystate live in objectb , given objecta property. in example this:
objecta:react.createclass({ proptypes: { ... }, render: function() { return (<div classname="my-class">'hello' +{ this.props.name }</div>); } }); objectb:react.createclass({ proptypes: { ... }, getinitialstate: function() { return { name: null } }, onnamechange: function(newname) { this.setstate({ name: newname }) }, render: function() { return ( <div classname="my-class"> <objecta name={ this.state.name } /> </div> ); } });
Comments
Post a Comment