javascript - 如何在 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文件中但没有用！

标签： javascriptjqueryvue.js