javascript - Access variable on child from parent in react.js -
i trying access variable "name" in child class parent class. using react routers on project. i've been using react few days, open suggestions or refactoring.
child class:
import react 'react'; import reactdom 'react-dom'; import { link } 'react-router'; export default react.createclass({ render: function() { return ( <ul classname="list"> {this.props.business.map(function(business, i) { let name = object.keys(business).length - 1; return ( <li key={business.id}> <link to="/" classname="inner"> <div classname="li-img"> <img src={business.image} alt="image alt text" /> </div> <div classname="li-text"> <h4 classname="li-head">{business.name}</h4> <p classname="li-sub">summary of content</p> </div> </link> </li> ); })} </ul> ) } });
parent class:
import react 'react'; import business './businesses'; import { getbusiness } 'api/global'; export default react.createclass({ getinitialstate: function() { return { business: [], } }, componentwillmount: function() { var _this = this; getbusiness().then(function(response) { _this.setstate({ business: response.data }) }).catch(function(err) { console.error(err); }); }, render: function() { return ( <business business={this.state.business} text={name} /> ) } });
i don't think can do, directly, attempting here.
at time render business
need know values want pass it. "construct" asking "i want pass parameter function calculated function calling".
communication between components gives hint @ needed: event causes re-render after new value (name
) has been computed.
this business updating state variable name
, cause re-render, or passing in callback (as example shows).
Comments
Post a Comment