基于vue.js实现侧边菜单栏

前端之家收集整理的这篇文章主要介绍了基于vue.js实现侧边菜单栏前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

侧边菜单栏应该是很多项目里必不可少的 自己手写了一个 下面是效果

下面就说一下实现的过程 还是比较简单的 首先导入一下需要的文件

接下来就是我的html

<div class="jb51code">
<pre class="brush:xhtml;">
<nav class="sider-bar small-bar">

  • 然后是css

    最后也就是我的js

    菜单 $("#full-bar").click(function(){ $(".sider-bar").toggleClass("small-bar"); if($(".sider-bar").hasClass('small-bar')){ $(".drop-list").slideUp(); } }); $(".drop-show").click(function(){ if(!$(".sider-bar").hasClass('small-bar')){ $(this).children(".drop-list").slideToggle(); $(this).siblings('li').children(".drop-list").slideUp(); } }); });

    本文已被整理到了《》,欢迎大家学习阅读。

    关于vue.js组件的教程,请大家点击专题进行学习。

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

    原文链接:https://www.f2er.com/vue/40593.html

    猜你在找的Vue相关文章