layui框架实战案例(3):使用多层嵌套json格式数据的使用templet解决方案

简介: layui框架实战案例(3):使用多层嵌套json格式数据的使用templet解决方案

官方标准的data数据json,在data数组中嵌套member和leader两个数组对象。

{
  "err": "",
  "res": "",
  "data": [
    {
      "totalPays": "767320.60",
      "paid_at": "2020-06-20 18:03:33",
      "uniacid": "5",
      "name": "奶品牛小二-威海站",
      "member": [
        {
          "memberTotal": "18368"
        }
      ],
      "leader": [
        {
          "leaderTotal": "959"
        }
      ]
    }],
  "code": 0,
  "count": 27,
  "msg": ""
}

只要在列头数组中,添加

templet: '<div>{{d.member[0].memberTotal}}</div>'

如图:

       , cols: [[
                {type: 'numbers'}
                , {field: 'name', title: '站点名称'}
                , {field: 'totalPays', title: '销量合计', align: "center"}
                , {
                    field: 'orders_category',
                    title: '团长数量',
                    align: "center",
                    templet: '<div>{{d.leader[0].leaderTotal}}</div>'
                }
                , {
                    field: 'memberTotal"',
                    title: '会员数量',
                    align: "center",
                    templet: '<div>{{d.member[0].memberTotal}}</div>'
                }
            ]]

如果判断templet数据格式,执行回调函数即可,其中d代表res.data。

 templet: function (d) {
                        if (typeof(d.leader[0]) == "undefined") {
                            return "0";
                        } else {
                            return d.leader[0].leaderTotal;
                        }
                    }


Done!

相关文章
|
4天前
|
JSON 人工智能 算法
探索LLM推理全阶段的JSON格式输出限制方法
文章详细讨论了如何确保大型语言模型(LLMs)输出结构化的JSON格式,这对于提高数据处理的自动化程度和系统的互操作性至关重要。
|
25天前
|
JSON 数据格式
LangChain-20 Document Loader 文件加载 加载MD DOCX EXCEL PPT PDF HTML JSON 等多种文件格式 后续可通过FAISS向量化 增强检索
LangChain-20 Document Loader 文件加载 加载MD DOCX EXCEL PPT PDF HTML JSON 等多种文件格式 后续可通过FAISS向量化 增强检索
47 2
|
14天前
|
JSON API 数据格式
商品详情数据JSON格式示例参考(api接口)
JSON数据格式的商品详情数据通常包含商品的多个层级信息,以下是一个综合多个来源信息的JSON数据格式的商品详情数据示例参考:
|
24天前
|
机器学习/深度学习 JSON JavaScript
LangChain-21 Text Splitters 内容切分器 支持多种格式 HTML JSON md Code(JS/Py/TS/etc) 进行切分并输出 方便将数据进行结构化后检索
LangChain-21 Text Splitters 内容切分器 支持多种格式 HTML JSON md Code(JS/Py/TS/etc) 进行切分并输出 方便将数据进行结构化后检索
20 0
|
2月前
|
XML 存储 JSON
Twaver-HTML5基础学习(19)数据容器(2)_数据序列化_XML、Json
本文介绍了Twaver HTML5中的数据序列化,包括XML和JSON格式的序列化与反序列化方法。文章通过示例代码展示了如何将DataBox中的数据序列化为XML和JSON字符串,以及如何从这些字符串中反序列化数据,重建DataBox中的对象。此外,还提到了用户自定义属性的序列化注册方法。
40 1
|
8天前
|
数据采集 JSON 数据处理
抓取和分析JSON数据:使用Python构建数据处理管道
在大数据时代,电商网站如亚马逊、京东等成为数据采集的重要来源。本文介绍如何使用Python结合代理IP、多线程等技术,高效、隐秘地抓取并处理电商网站的JSON数据。通过爬虫代理服务,模拟真实用户行为,提升抓取效率和稳定性。示例代码展示了如何抓取亚马逊商品信息并进行解析。
抓取和分析JSON数据:使用Python构建数据处理管道
|
12天前
|
JSON JavaScript Java
在Java中处理JSON数据:Jackson与Gson库比较
本文介绍了JSON数据交换格式及其在Java中的应用,重点探讨了两个强大的JSON处理库——Jackson和Gson。文章详细讲解了Jackson库的核心功能,包括数据绑定、流式API和树模型,并通过示例演示了如何使用Jackson进行JSON解析和生成。最后,作者分享了一些实用的代码片段和使用技巧,帮助读者更好地理解和应用这些工具。
在Java中处理JSON数据:Jackson与Gson库比较
|
22天前
|
JSON JavaScript API
(API接口系列)商品详情数据封装接口json数据格式分析
在成长的路上,我们都是同行者。这篇关于商品详情API接口的文章,希望能帮助到您。期待与您继续分享更多API接口的知识,请记得关注Anzexi58哦!
|
24天前
|
JSON 前端开发 Java
【Spring】“请求“ 之传递 JSON 数据
【Spring】“请求“ 之传递 JSON 数据
78 2
|
2月前
|
存储 JSON Go
在Gin框架中优雅地处理HTTP请求体中的JSON数据
在Gin框架中优雅地处理HTTP请求体中的JSON数据