Bootstrap 4侧边栏上的NiceScroll.js无法正常工作

Question

我正在尝试在侧边栏菜单上实现nicescroll.js。 Sidemenu已隐藏，并使用js代码显示：

$('#dismiss, .sidebar-overlay').on('click', function () {
        // hide sidebar
        $('#sidebar').removeClass('active');
        // hide overlay
        $('.sidebar-overlay').removeClass('active');
        // animate icon
        $('#sidebarCollapse').removeClass('active');
    });

        $('#sidebarCollapse').on('click', function () {
            // open sidebar
            $('#sidebar').addClass('active');
            // fade in the overlay
            $('.sidebar-overlay').addClass('active');
            $('.collapse.in').toggleClass('in');
            $('a[aria-expanded=true]').attr('aria-expanded', 'false');
            $('.collapse.show').removeClass('show');
            // animate icon
            $('#sidebarCollapse').addClass('active');
        });

现在在侧边栏上，我尝试像这样使用nicescroll.js：

$('#sidebarCollapse').on('click', function () {
  $("#sidebar-menu").niceScroll({
    scrollspeed: 80,
    mousescrollstep: 40,
    cursorcolor: "#949caf",
    cursoropacitymax: 0.5
  });
  $("#sidebar-menu").getNiceScroll().resize();
});

    $('#dismiss', '.sidebar-overlay').click(function () {
        $("#sidebar-menu").getNiceScroll().remove();
    });

但是没有成功。当我单击“ #sidebarCollapse”时，我需要在sidemenu上初始化nicescroll，然后在单击“ #dismiss”或“ sidebar-overlay”时将其删除。

您可以在此处查看我在Codepen上的示例： https://codepen.io/haralake/pen/YJoJPg