uniapp展开收起动画

uniapp中可以使用 `v-if` 和 `v-show` 来实现展开收起的功能，通过点击按钮来控制这两个指令的显示与隐藏。同时可以使用 CSS 中的 transition 属性来添加动画效果，使展开收起更加平滑。

具体实现方式如下：

<template>
  <div>
    <div class="content" v-show="isShow">
      <!-- 需要展示的内容 -->
    </div>
    <div class="btn" @click="toggleShow">
      {{ isShow ? '收起' : '展开' }}
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isShow: false // 控制是否展开的变量
    }
  },
  methods: {
    toggleShow() {
      this.isShow = !this.isShow
    }
  }
}
</script>

<style>
.content {
  transition: height .5s ease; // 设置高度变化的动画效果
  overflow: hidden; // 隐藏超出部分
}
</style>