在.map循环中将节点结果限制为10
在.map循环中将节点结果限制为10
提问于 2021-04-02 00:38:29
我想在下面的返回表中将我的结果限制为10。
我不知道该怎么编码。我不能在最初的graphQL应用程序接口调用中这样做，因为它会获取多个显示的结果(我需要获取所有内容，然后过滤掉不需要的内容)。
return (
<Carousel
activeIndex={index}
onSelect={handleSelect}
>
{finearts.nodes
&& finearts.nodes.map((arts) => (
imageQuery(arts) ?
<Carousel.Item className="" key={arts.databaseId}>
<Image src={arts.fineartfields.cloudlink}
alt={arts.featuredImage.node.altText}
className="carousel-image img-fluid shadow-sm"
width={arts.featuredImage.node.mediaDetails.width}
height={arts.featuredImage.node.mediaDetails.height}
/>
</Carousel.Item>
: null
), [])}
</Carousel>
)回答 1
Stack Overflow用户
发布于 2021-04-02 00:52:25
您可以在finearts.nodes上使用slice
finearts.nodes.slice(0, 10 )将返回数组中的前10个条目，这些条目可以进一步链接到map函数；因此，map只能在finearts.nodes数组的前10个条目上操作
将建议应用于您的代码-
return (
<Carousel
activeIndex={index}
onSelect={handleSelect}
>
{finearts.nodes
&& finearts.nodes.slice(0,10).map((arts) => (
imageQuery(arts) ?
<Carousel.Item className="" key={arts.databaseId}>
<Image src={arts.fineartfields.cloudlink}
alt={arts.featuredImage.node.altText}
className="carousel-image img-fluid shadow-sm"
width={arts.featuredImage.node.mediaDetails.width}
height={arts.featuredImage.node.mediaDetails.height}
/>
</Carousel.Item>
: null
), [])}
</Carousel> )
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/66908420
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号