vue也可以实现jquery的 slidedown

结合原生js与transition 动画完成slidedown

   clickBy(){//点击事件
      let slide = { //down up事件      
          down : function(div){
            div.style.height='140px';
          },              
          up : function(div){
            div.style.height='0';
          }
        }
        function toggleSlide(id,s){
            var div = document.getElementById(id),
            div_height = div.offsetHeight;
            div.style.transition='height '+s+'ms';  
            div.style.overflow='hidden';                    
            if(div_height){
                slide.up(div);
            }else{
                slide.down(div);
            }
        }
        toggleSlide('groupRadioBox','300')//调用事件传值
      let classN=this.$refs.caret.className//获取类名
      if(classN=='el-icon-caret-bottom'){//切换图标类名
        this.$refs.caret.setAttribute("class",'el-icon-caret-right')
      }else{
        this.$refs.caret.setAttribute("class",'el-icon-caret-bottom')
      }
    }

 

Logo

前往低代码交流专区

更多推荐