如何在单个渲染中使用嵌套映射获取数据？

Question

我正在尝试打印下面给出的数据.。我在渲染中使用了嵌套地图，其中第一个地图是打印类别名称和链接视图all.And在第二个/嵌套地图我正在尝试循环遍历父映射中列出的属于该类别的数据。但是我得到了unexpected token at nested return的错误。

在FeaturedSection.js中渲染函数

  <div className="data-container">
    <div  className="row mx-0">
      {this.state.newData && Object.keys(groupedByCategory).map(function(categoryName,i)
        {return(
          <div key={i}  className="row mx-0">
              <div className="col-sm-10 col-md-10 col-lg-10 lrPadding">
                <h3 className="featureTitle">Featured {`${categoryName}`}</h3>
              </div>
              <div className="col-sm-2 col-md-2 col-lg-2 lrPadding">
                <Link to="#" className="routeDecorator ">
                <h5 className="featureTitle float-right mt-3">View All
                 <i className="fa fa-angle-right font-weight-bold px-1" aria-hidden="true"></i>
                </h5>
                </Link>
              </div>
              groupedByCategory[categoryName].map(function(data,i)
                {
                  return (

                        <FeaturedOffer
                          title={data.name}
                          offerDescription={data.offerdescription}
                          rewardImage={data.reward_image}
                          productName={data.modelname}
                          thumbnailImage={data.thumbnailimage}
                        />
                );
              })
          </div>
        );})}
    </div>
  </div>

Answer 1

我想你需要在{}中包装你的地图。

{ 
  groupedByCategory[categoryName].map((data,i) => {(
    <FeaturedOffer
      key={i}
      title={data.name}
      offerDescription={data.offerdescription}
      rewardImage={data.reward_image}
      productName={data.modelname}
      thumbnailImage={data.thumbnailimage}
    />
  })
}