如何从特定索引映射然后在特定索引之后停止[重复]

Posted 2023-02-22

【中文标题】如何从特定索引映射然后在特定索引之后停止[重复]

【英文标题】：How to map from a particular index and then stop at after a particular index [duplicate]

【发布时间】：2020-10-12 09:08:33

【问题描述】：

我正在尝试制作一个反应列表，但我被卡住了，因为在我的状态下，数组中有 50 个对象，我只想渲染 10 个对象我不知道如何在特定索引后停止渲染任何人都可以帮忙我这里是我正在尝试做的代码 我正在使用材质ui

const AnimeResults = ( search:  animelist, isAnimeLoaded  ) => 
    const classes = useStyles();
    return isAnimeLoaded ? (
        <Spinner />
    ) : (
            <List dense className=classes.root>
                animelist.map((anime, index) => 
                    const labelId = `checkbox-list-secondary-label-$index`;
                    return (
                        <ListItem key=anime.mal_id button>
                            <ListItemAvatar>
                                <Avatar
                                    alt=`Avatar n°$anime + 1`
                                    src=anime.image_url
                                />
                            </ListItemAvatar>
                            <ListItemText id=labelId primary=`$anime.title` />
                            <ListItemSecondaryAction>
                                <div>+</div>
                            </ListItemSecondaryAction>
                        </ListItem>
                    );
                )
            </List>
        );

希望我能解释一下自己，谁能帮助我，我被卡住了

【参考方案1】：

.map 循环调用整个数组，所以slice 在它之前

animelist.slice(0,10).map(...)

或者更动态地使用slice(x, x+ 10)

【讨论】：

谢谢 对我有用的肯定会尝试动态的

【参考方案2】：

试试这个：

animelist.slice(0, 10).map((anime, index) =>

您可以使用 slice 获取第一个 X 数量（在您的情况下为 10），然后在该数组上使用 map

【讨论】：

哦，那很快就可以了，谢谢它的工作

你试试看它是否适合你以及你想要什么

@Arun 不用担心。如果有机会，请标记为正确，谢谢

是的，它会显示 10 分钟，然后我才能正确添加：D