Html Algolia-如何自定义菜单选择下拉列表中的标记显示名称

我在Algolia instantSearch中找到了这个menuSelect小部件，并成功实现了它。但当前它显示的过滤器名称是直接来自索引配置的标记。有没有办法用我自己的过滤器替换这些名称？e、 g.显示

react店面，而不是
react\u pwa
，这是html输出


items.map（item=>({
…项目，
}))}/>

有人知道我是否可以使用
transformItems
道具来解决这个问题吗？谢谢
 构建一个自定义的menuSelect小部件就可以做到这一点

const MenuSelect = ({ items, currentRefinement, refine }) => (
  <select
    value={currentRefinement || ''}
    onChange={event => refine(event.currentTarget.value)}
  >
    <option value="">See all options</option>
    {items.map(item => (
      <option
        key={item.label}
        value={item.isRefined ? currentRefinement : item.value}
      >
        {item.label==="react_pwa" && 'React PWA Storefront'}
        {item.label==="cloudops-aws" && 'CloudOps for AWS'}
        {item.label==="commerce-manager" && 'Commerce Manager'}
        {item.label==="cloudops-azure" && 'CloudOps for Azure'}
        {item.label==="chatbot" && 'Reference Chatbot'}
        {item.label==="alexa-skill" && 'Alexa Skill'}
        {item.label==="account-management" && 'Account Management'}
      </option>
    ))}
  </select>
);

const CustomMenuSelect = connectMenu(MenuSelect);

const MenuSelect=（{items，currentRefineration，refine}）=>(
优化（event.currentTarget.value）}
>
查看所有选项
{items.map（item=>(
{item.label==“react_pwa”&&“react pwa店面”}
{item.label==“cloudops aws”&&“cloudops for aws”}
{item.label===“商务经理”&&“商务经理”}
{item.label==“CloudOpsAzure”&&“CloudOpsForAzure”}
{item.label==“聊天机器人”&&“引用聊天机器人”}
{item.label==“alexa skill”&&“alexa skill”}
{item.label===“帐户管理”&&“帐户管理”}
))}
);
const CustomMenuSelect=连接菜单（MenuSelect）；

然后在搜索类中添加

const MenuSelect = ({ items, currentRefinement, refine }) => (
  <select
    value={currentRefinement || ''}
    onChange={event => refine(event.currentTarget.value)}
  >
    <option value="">See all options</option>
    {items.map(item => (
      <option
        key={item.label}
        value={item.isRefined ? currentRefinement : item.value}
      >
        {item.label==="react_pwa" && 'React PWA Storefront'}
        {item.label==="cloudops-aws" && 'CloudOps for AWS'}
        {item.label==="commerce-manager" && 'Commerce Manager'}
        {item.label==="cloudops-azure" && 'CloudOps for Azure'}
        {item.label==="chatbot" && 'Reference Chatbot'}
        {item.label==="alexa-skill" && 'Alexa Skill'}
        {item.label==="account-management" && 'Account Management'}
      </option>
    ))}
  </select>
);

const CustomMenuSelect = connectMenu(MenuSelect);