如何在Vue JS模板中编写自定义jQuery代码

Question

我对VueJS有点陌生，并且使用 webpack-simple ，我制作了一个补充工具栏组件，并从互联网上放置了一些补充工具栏代码，但该补充工具栏可在jQuery上使用。我搜索了互联网，但找不到将jQuery代码用于vue模板的方法，我的jQuery代码：

$(".sidebar-dropdown > a").click(function() {
  $(".sidebar-submenu").slideUp(200);
  if (
    $(this)
      .parent()
      .hasClass("active")
  ) {
    $(".sidebar-dropdown").removeClass("active");
    $(this)
      .parent()
      .removeClass("active");
  } else {
    $(".sidebar-dropdown").removeClass("active");
    $(this)
      .next(".sidebar-submenu")
      .slideDown(200);
    $(this)
      .parent()
      .addClass("active");
  }
});

$("#close-sidebar").click(function() {
  $(".page-wrapper").removeClass("toggled");
});
$("#show-sidebar").click(function() {
  $(".page-wrapper").addClass("toggled");
});

Vue文件：

<template>
  <div id="app">
    <navbar></navbar>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  data () {
    return {
    }
  }
}
</script>

  

我还直接将代码添加到了index.html文件中，但是没有用！