使用Simplebar自定义Select2下拉菜单的滚动条？

Question

我正在尝试使用SimpleBar库自定义Select2下拉菜单中的滚动条。通常，我所做的是按照Simplebar库中的指示，使用以下标记包装包含滚动条的元素：

<div data-simplebar></div>

但这里的棘手之处在于，需要包装的Select2类select2-results__options不仅在页面加载时生成，而且仅在Select2下拉菜单打开时生成。

Simplebar提供了另一种你可以使用的方法，就是这样：

new SimpleBar(document.getElementById('myElement'));

然而，我尝试以此为目标的元素既不是Id，也不存在，直到我选择下拉列表并打开它，这使它变得无用。

有没有办法用另一种方法定制滚动条？

简单栏文档：https://github.com/Grsmto/simplebar/tree/master/packages/simplebar

Select2：https://select2.org/getting-started/basic-usage

Answer 1

$('select').on('select2:open', function () {
  var optionsContainer = $('.select2-results__options').get(0);

  setTimeout(function () {
    new SimpleBar(optionsContainer);
  }, 0);
});