vue.js如何写折叠面板的列表

Question

就类似这样的 求大神看下

Answer 1

自己码啊，标题为一个层级，展开的内容为该层级下的另一个层级，通过v-show来控制其显示隐藏。如果是数组循环的话，设置一个数组变量。<ul>&nbsp; &nbsp; <li v-for="(item,index) in list">&nbsp; &nbsp; &nbsp; &nbsp; <p>注册是支行信息如何进行填写？<span @click="changeContent(index)"></span></p>&nbsp; &nbsp; &nbsp; &nbsp; <div v-show="item.showContent">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 结算账户的填写...&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </li></ul>data(){&nbsp; &nbsp; return{&nbsp; &nbsp; &nbsp; &nbsp; list:[{'title':'注册是支行信息如何进行填写？','showContent':false,...},{'title':'注册是支行信息如何进行填写？','showContent':false,...}...]&nbsp; &nbsp; }},methods:{&nbsp; &nbsp; changeContent:function(index){&nbsp; &nbsp; &nbsp; &nbsp; var temp = this.list&nbsp; &nbsp; &nbsp; &nbsp; temp[index].showContent = ! temp[index].showContent&nbsp; &nbsp; &nbsp; &nbsp; this.list = temp&nbsp; &nbsp; }}