このjsonファイルをどのように反復処理できますか？

Question

私は反応して私のCVをしたいです。 私は、出力データが

{ 

    "experience":[ 
     { 
      "Title":"Somewhere", 
      "Date":"2015 - 2015", 
      "Description": 
      [ 
       "Participate in the full development lifecycle, following a SCRUM methodology applied to core product", 
       "Participate in the full development lifecycle, following a SCRUM methodology applied to core product", 
       "Participate in the full development lifecycle, following a SCRUM methodology applied to core product" 
      ] 

     }, 
     { 
      "Title":"Somewhere", 
      "Date":"2015 - 2015", 
      "Description": 
      [ 
       "Participate in the full development lifecycle, following a SCRUM methodology applied to core product", 
       "Participate in the full development lifecycle, following a SCRUM methodology applied to core product", 
       "Participate in the full development lifecycle, following a SCRUM methodology applied to core product" 
      ] 

     } 

    ] 
} 

私はexperience.js

const Experience = (props) => (
    <div className="container"> 
     <p className="subtitle">WORK EXPERIENCE</p> 
     <hr className="subtitles"/> 

     <ul className="left-box"> 
    {props.data.map((info,i) => 
      <li key={i} className="top"> 
       <div className="year"> 
         <h4>{info.Date}</h4> 
         <span> {info.Title}</span> 
       </div> 
       <div className="box-content" > 
        <h4 className="sameHeightTitle">Front End Developer</h4> 
        <ul className="left-box-content"> 
         <li className="sec-layer"> 
         {info.Description} 
         </li> 
        </ul> 

       </div> 
      </li> 
    )} 
    </ul> 
    </div> 
    ); 

問題でそれを呼び出していたときにしかし、私は問題に遭遇し、すべての私の経験、教育、より多くが含まれているJSONファイルを持っています私はそれをすべて同じ箇条書きに書いています。基本的に私のJSONファイルに参加するで始まるすべての文字列は、次の新しいbullet.Theの隣にあるべき出力のスクリーンショットです：

EDIT：あなたのDescriptionがある

const Experience = (props) => (
    <div className="container"> 
     <p className="subtitle">WORK EXPERIENCE</p> 
     <hr className="subtitles"/> 

     <ul className="left-box"> 
    {props.data.map((info,i) => 
      <li key={i} className="top"> 
       <div className="year"> 
         <span className="sub-sub-title"> {info.Title}</span> 
         <h4>{info.Date}</h4> 
       </div> 
       <div className="box-content" > 
        <h4 className="sameHeightTitle">Front End Developer</h4> 
        <ul className="left-box-content"> 
        {info.Description.map((newDesc, o)=> 
         <li> 
         {newDesc} 
         </li> 
         )} 

        </ul> 

       </div> 
      </li> 
    )} 
    </ul> 
    </div> 
    ); 

Answer 1

回答アレイ。あなたはそれを反復する必要があります。どのようなjsライブラリを使用していますか？あなたはその言語でリストを反復する方法を見つける必要があります。

これはforeachループの構文ではありませんが、あなたはそのアイデアを得るでしょう。

foreach(var description in info.Description){ 
        <li className="sec-layer"> 
        {description} 
        </li> 
}