Question

我想做我的cv反应。我有一个json文件，其中包含我的所有经验，教育等等但是当我输出数据时遇到问题

{

    "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文件开头的字符串都应该在新的子弹旁边。以下是输出的屏幕截图：

编辑：回答

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

您的Description是一个数组。你需要迭代它。您使用的是什么js库？您需要了解如何使用该语言迭代列表。

这不是foreach循环的语法，但你会明白这一点。

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

我怎么能遍历这个json文件？

1 个答案: