Javascript BlueprintJS:SUGGEST=>如何限制popover上的行数？

如何使用BluePrintJS的Suggest组件限制显示的行号在popOver中添加一个scollbar

<Suggest
    items={this.state.Plats}
    activeItem={this.state.activePlat}
    onActiveItemChange={this.handleActiveItemChange}
    itemRenderer={renderPlat}
    itemPredicate={filterFilm}
    onItemSelect={this.handleClick}
    noResults={<MenuItem disabled={true} text="Pas de résultat." />}
    inputValueRenderer={this.renderValue}
    popoverProps={{minimal: true, usePortal: true}}
/>

const filterFilm: ItemPredicate<IPlat> = (query, plat) => {
    const text = `${plat.Nom}`;
     return text.toLocaleLowerCase().indexOf(query.toLowerCase()) >= 0;
};

const renderPlat: ItemRenderer<IPlat> = (Plat, { handleClick, modifiers}) => 
{
  if (!modifiers.matchesPredicate){
    return null;
  }
  const text = `${Plat.Key}. ${Plat.Nom}`;
  return <MenuItem 
    key={Plat.Key} 
    active={modifiers.active}
    disabled={modifiers.disabled}
    label={Plat.Categorie}
    onClick={handleClick} 
    text={text} />;
};

我想将列表限制为10项，如网站上的示例所示，但我尝试的一切都不起作用

感谢您的建议和帮助。

您应该使用itemListRenderer道具。从：

ItemListRenderer 下拉列表内容的自定义渲染器

默认实现为每个传递谓词的项调用itemRenderer，并将它们全部包装到菜单元素中。如果查询为空，则返回initialContent，如果没有与谓词匹配的项，则返回noResults。 继承自IListItemsProps.itemListRenderer

---

您可以使用自己的渲染器功能自定义道具。在您的情况下，您可能可以提升并添加一行，将项目数限制为X。

您显示的图像不是建议组件的正常样式。您是否包括建议的CSS文件？确保添加了该选项，因为这将限制popover的高度，并使内容可滚动，而不是在整个页面高度上显示一个巨大的列表。

感谢您的回答，并对长时间的延迟表示抱歉。我会检查并通知你的。非常感谢。这是正确的答案。只有一件事，它是“blueprint select.css”，但你给了我一个非常强烈的暗示；很高兴听到我能帮忙。我以前也遇到过类似的问题，所以我想知道问题可能是什么。谢谢你的回答。我使用itemListRenderer。我认为解决问题的方法是使用CSS，正如user5661402所提到的。不管怎样，我一测试就会发布