博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue 二级列表折叠面板
阅读量:4709 次
发布时间:2019-06-10

本文共 742 字,大约阅读时间需要 2 分钟。

请求出来的数据是二级列表,需要点击一级列表展开相应的二级列表

data(){   return {       info: [     {name:'一级菜单1',lists:[{price:1},{price:2}]},     {name:'一级菜单2',lists:[{price:1},{price:2}]},     {name:'一级菜单3',lists:[{price:1},{price:2}]}    ]    }}
{
{item.name}} {
{item.lowprice}}
  • {
    {list.price}}

点击显示隐藏二级列表

this.info.forEach(i=>{          // console.log(i)          // 给对象加一个true/false的属性,控制下级列表的显示隐藏          i.isShow=== undefined? this.$set(i,'isShow',false) : i.isShow= false;          // 这个属性是在一级列表显示下级列表中的最低价          i.lowprice === undefined? this.$set(i,'lowprice',0):i.lowprice = 0;          i.lists.forEach(j=>{          if(j.price

 

转载于:https://www.cnblogs.com/leiting/p/9045298.html

你可能感兴趣的文章
Linux 中/etc/profile、~/.bash_profile 环境变量配置及执行过程
查看>>
JAVA:图形之利用FontMetrics类居中
查看>>
使用rsync同步目录
查看>>
[读码时间] for循环遍历设置所有DIV块元素背景色为红色
查看>>
网页调用迅雷下载文件
查看>>
Python 调用 Shell命令
查看>>
POJ 1159 Palindrome(最长公共子序列)
查看>>
责任链模式(chain of responsibility)
查看>>
[转载]java多线程学习-java.util.concurrent详解(一) Latch/Barrier
查看>>
ionic - 运行起来
查看>>
Shell 输入/输出重定向
查看>>
数据结构与算法分析(C++)读书笔记
查看>>
(转)nginx应用总结(1)--基础认识和应用参数优化配置
查看>>
(转)关于sql和MySQL的语句执行顺序(必看!!!)
查看>>
UVALive 3668 A Funny Stone Game(博弈)
查看>>
信息论随笔2: 交叉熵、相对熵
查看>>
再学习之MyBatis.
查看>>
CodeWars题目筛选
查看>>
MySQL— 索引
查看>>
电子书下载:Professional Web Design: Techniques and Templates, 4th Edition
查看>>