reactjs - Value empty in react UI but visible in the console -
i using react flux. when checked in console, values coming when check in react developer tools, expected value empty. if sending single object working fine. if array sent, nothing displayed.
can please tell problem? code , image of same below.
code:
var product = react.createclass({ render: function(){ var product = this.props.product; return (<div classname="col-md-8"><hr/> {product.map(function(items){ console.log(" items in field :"+json.stringify(items)); <div classname="col-sm-6"> <div classname="col-sm-4"> <img src={"/src/image/"+ items.image}/> </div> <div classname="col-sm-2"> <h2> {items.name} </h2> <p> {items.description} </p> <h3> price: ${items.price} </h3> <h4>inventory: {items.inventory}</h4> </div> </div> })} </div> ) } });
you need return function call
var product = react.createclass({ render: function(){ var product = this.props.product; return (<div classname="col-md-8"><hr/> {product.map(function(items){ console.log(" items in field :"+json.stringify(items)); return (<div classname="col-sm-6"> <div classname="col-sm-4"> <img src={"/src/image/"+ items.image}/> </div> <div classname="col-sm-2"> <h2> {items.name} </h2> <p> {items.description} </p> <h3> price: ${items.price} </h3> <h4>inventory: {items.inventory}</h4> </div> </div>); })} </div> ) } });
Comments
Post a Comment