如何获取降档useSelect项变化触发的实际事件

Question

我正在使用

downshift

提供的 useSelect 钩子。

我遇到了一种情况，无法将

items

更改为

useSelect

。

每个菜单项都有一个需要事件作为参数的处理程序，但我没有找到一种方法来访问用户触发的实际事件。

典型的菜单项如下所示

menuItems: [{
  label: 'foo',
  value: 'bar',
  onClick: (event) => doTheThing(event),
}]

在之前的案例中，我利用

onSelectItemChange

处理程序来获取所选项目

const { getItemProps, getLabelProps, getMenuProps, getToggleButtonProps, highlightedIndex, isOpen } = useSelect({
  items: menuItems,
  onSelectedItemChange: ({ selectedItem }) => {
    // call the item's event handler
    selectedItem.onClick(<here's where I need the actual event object>);
  }
});

但传递给

onSelectedItemChange

的参数不包括触发所选项目更改的实际事件。

我已经在 the downshift repo 中搜索了返回事件的函数，但没有什么突出的。

也许我可以使用另一种策略来获取事件？

Answer 1

查看文档。 此声明似乎表明您正在提供选择器。 你能不能只在里面放一个钩子？

useSelect 用于自定义选择组件。