loop through json reactJS -

id loop through json file displaying first level values links so:

  <route path='/acordes' component={acordes}>     <indexroute component={la} />     <route path='lasib' component={lasib} />     <route path='query' component={query} />   </route> 

json

{     "la": {         "tonomayor": "a",         "tonomenor": "am",         "septima": "a7",         "sexta": "a6",         "menorsexta": "am6",         "menorseptima": "am7",         "septimamayor": "a7m",         "disminuida": "adim7",         "aumentados": "aaug"     },     "la#sib": {         "tonomayor": "la#",         "tonomenor": "a#m",         "septima": "a#m",         "sexta": "a#6",         "menorsexta": "a#m6",         "menorseptima": "a#m7",         "septimamayor": "a#7m",         "disminuida": "a#dim7",         "aumentados": "a#aug"     } } 

js

import react, { component } 'react' import { router, route, link, indexroute, hashhistory, browserhistory, defaultroute, indexlink } 'react-router' import data '!json!../json/acordes.json';  class app extends component {   render () {     return (       <router history={hashhistory}>         <route path='/' component={container}>           <indexroute component={home} />           <route path='/acordes' component={acordes}>             <indexroute component={la} />             <route path='lasib' component={lasib} />             <route path='query' component={query} />           </route>           <route path='/about(/:name)' component={about} />           <route path='/namedcomponent' component={namedcomponents}>             <indexroute components={{ title: title, subtitle: subtitle }} />           </route>           <route path='*' component={notfound} />         </route>       </router>     )   } } 

then when user clicks on {la} should show contents of json.