展开收起

vue项目中展开收起功能

简单操作

npm i @lijixuan/collapse-transition import packUp from '@lijixuan/collapse-transition'; mixins: [packUp]

el-button(type="text" class="ml10" @click="packUp") span(class="mr5 ml10") {{ packUpFlag ? '收起' : '展开' }} i(:class="packUpFlag ? 'el-icon-arrow-up' : 'el-icon-arrow-down'")

将要展开收起的元素进行包裹

collapse-transition div(class="collapse-wrap" v-show="packUpFlag") //- 你的内容

变量与方法 可以进行覆盖

packUpFlag: Boolean; // 可以进行覆盖 packUp() { this.packUpFlag = !this.packUpFlag; }