uni-app 小程序 下拉框折叠 动画 简单实现

通过动态设置展示区域的高度实现，初始定位0rpx；
在点击箭头的时候，动态赋值其真实高度，通过transition: all .38s 来实现

话不多说 直接上代码

<view :style="{ height: item.show ? `${(item.tableData.length * 84) - 2 }rpx` : '0' }" 
   class="content-region"
 >
  ****
view>

 .content-region {
   height: 0rpx;
   overflow: hidden;
   transition: all .38s;
 }

没错，其实就这么简单就完事了，下面来个完整点的。