reactjs - Rendering Firebase Data in React -

i'm looking render firebase data homefeed component. update state in componentdidmount method. can see looks below. it's array. should map on using map function? how access specific info "title", "link", "type", etc. able render it?

thanks lot!

var react = require('react'); var rebase = require('re-base'); var base = rebase.createclass("https://nimbus-8ea70.firebaseio.com/");  // todo: render firebase data screen.  // home // <home /> var homecontainer = react.createclass({     render : function() {         return (             <div classname="homecontainer">                 <homefeed />             </div>         );     } });  // home feed // <homefeed /> var homefeed = react.createclass({     componentdidmount: function() {         base.fetch('article', {             context: this,             asarray: true,             then(data){                 console.log(data);                 this.setstate({                     feed: data                 })             }         });     },     getinitialstate: function() {         return {             feed: []         }     },      render : function() {         return (             <div classname="homefeed">                 {/* use map function here? */}             </div>         );     }  });  module.exports = homecontainer; 

render run whenever state has been changed (unless modify behavior with, say, shouldcomponentupdate) long use setstate component automatically update when state changes.

if you're asking how turn array render understands, yes, map common way that. might this:

render : function() {     return (         <div classname="homefeed">             {this.state.feed.map(function(ea){                 return <div>{ea.someproperty}</div>             })}         </div>     ); } 

note have wrap ea.someproperty in curly braces because you're inserting jsx inside of javascript expression inside of more jsx. kind of nested jsx/expression/jsx structure you'll have comfortable in react i'm afraid.

more array.map