vue for循环出来的数据变成折叠面板

哈哈hyc

于 2020-03-09 19:52:40 发布

阅读量1.2k

点赞数

分类专栏：前端——vue 文章标签： vue javascript

本文链接：https://blog.csdn.net/erdfty/article/details/104759618

版权

前端——vue 专栏收录该内容

22 篇文章

订阅专栏

本文探讨了在Vue.js中使用v-for指令结合@click事件和动态:class绑定来实现列表项的显示与隐藏功能。通过定义一个flag数组并利用其布尔值控制对应的元素样式，实现了列表项点击后状态的切换。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

v-for 里面写 :class ='{active:flag[index]} @click="showContent(index)"
data:{
    flag:[]
}
showContent:function(index){
    var f=this.flag[index] = !this.flag[index]
    this.$set(this.flag,index,f);
}
.active{
    display: none;
}