Jquery 带React和Bootstrap的可折叠侧边栏

我想使用Bootstrap和React制作一个可折叠的侧边栏，我将遵循本教程。

我能够生成一个静态站点，但是我不能让jquery脚本与React一起工作。我有一些来自旧站点的Jquery文件，我将把它们传输到新站点。我需要采取不同的方法吗

$("#menu-toggle").click(function(e) {
        e.preventDefault();
        $("#wrapper").toggleClass("toggled");
    });
     $("#menu-toggle-2").click(function(e) {
        e.preventDefault();
        $("#wrapper").toggleClass("toggled-2");
        $('#menu ul').hide();
    });

     function initMenu() {
      $('#menu ul').hide();
      $('#menu ul').children('.current').parent().show();
      //$('#menu ul:first').show();
      $('#menu li a').click(
        function() {
          var checkElement = $(this).next();
          if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
            return false;
            }
          if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
            $('#menu ul:visible').slideUp('normal');
            checkElement.slideDown('normal');
            return false;
            }
          }
        );
      }
    $(document).ready(function() {initMenu();});

---

理想情况下，除非有充分的理由，否则不应将jQuery与React一起使用（请参阅）。React的工作原理是将真实的DOM与其自己的虚拟DOM保持同步，因此，如果jQuery在React执行其任务时试图操纵DOM，它就不喜欢这样

在您的情况下，可能最好使用React组件，例如，或。Material UI等组件的集合也提供了此功能（）

---

编辑-删除React Components链接，因为它是一个死链接和垃圾邮件填充。

谢谢，我会查出来的！第一个边栏组件已不再维护。@日本银行感谢您的提醒-已删除该组件并替换为其他两个组件：）回答使用

react bootstrap为可折叠边栏菜单提供另一种方式