具有确定和重置选项的 Antd 下拉组件

Question

我想使用 Dropdown 组件并提供两个选项 OK 和 reset 按钮（如 Table 示例中提供），

经过一些研究，我没有在 Dropdown or Menu 组件 api、

中找到任何关于此功能的提及

是否有人在 Table 组件之外实现了此类功能，请问这是如何工作的？

Answer 1

您将希望通过 javascript/jQuery 绑定到更改事件。

在 $(document.ready() 上，您可以调用将执行此绑定的函数。

然后您只需通过 jQuery 选择器检查下拉列表的值。

<script>
$(document).ready(function() {
    $("dropdownSelector").change(function() {
        var val = $(this).value();
        //logic to do things
    });
});
</script>

您可以在此处查看使用 jQuery 选择器的不同方式：https://api.jquery.com/category/selectors/

Answer 2

实现该组件的 OK 和 RESET 选项的代码是专门为此处的 table 下拉菜单实现的 (https://github.com/ant-design/ant-design/blob/master/components/table/filterDropdown.tsx#L196-L222)。

您可以类似地实现它（即用 div 包装 Menu 并自己处理事件）或者您可以创建一个 ant design github 票证并询问是否) 这应该是设计规范的一部分，并且 b) 是否应该有一种可重用的方式来使用它

Answer 3

根据 github 中的 this 问题，可以通过 Popover 和 Menu + Buttons

实现此类功能

具有确定和重置选项的 Antd 下拉组件

Antd Dropdown component with OK and reset options

reactjs

antd