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!

posted on 2020-08-03 13:21  漏刻有时  阅读(166)  评论(0)    收藏  举报