对于高度不确定，想要使用transition使高度有过渡效果，解决方法如下-蒲公英云

对于高度不确定，想要使用transition使高度有过渡效果，解决方法如下

先看效果图：

从效果图上可以看出，该折叠层包含两层；所有分类可以折叠，里面的分类分级，渠道品牌，品牌，产业还可以折叠；

只有外层有高度过渡效果，内层没有；两层折叠的时候，其实我并没有完美解决好内层的过渡效果；

初始状态是外层是展开的，内层是折叠的；内层终止高度不确定，才会出现内层没有过渡效果；如果内层也是展开的，则可以完美解决；先以外层有过渡，内层无过渡的情况来说明思路：

初始时，外层设置一个高度H1，内层每一个都等高就ok，也设置一个高度h1，外层是展开的，内层是关闭的，点击外层的收起筛选按钮，外层高度由 H1 变为 0；这个可以使用 transition 来过渡，点击内层的展开的时候，先设置外层的高度为auto，内层展开后，会把外层自动撑高，同时使用 document.getElementById(‘allCategory’).offsetHeight 记录一下外层的高度 H2，当点击外层的拉起筛选按钮的时候，外层的高度就可以从 H2过渡到0了，再点击展开筛选的时候，高度再0变成 H2 ;

this.category = document.getElementById('allCategory').offsetHeight
        document.getElementById('allCategory').style.transitionProperty = 'height'
        document.getElementById('allCategory').style.transitionDuration = '1s'
        document.getElementById('allCategory').style.height = '0px'