如何用模板渲染后台返回不确定的data
Posted pixelK
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何用模板渲染后台返回不确定的data相关的知识,希望对你有一定的参考价值。
工作中遇到一个需求,要求把后台返回的所有数据依次渲染出来,数据的key、value都是不确定的。刚开始觉得不行,后来想了下还是可以实现的,那就是通过二维数组。
假设后台传来的是json数据:
var data = [{ "oppName": "杨过", "oppNo": "12345678", "bankName": "中国银行", "amt": 180, "buildDate": "2017-09-18", "buildTime": "15:58:03", "acceptNo": "170918", "journal": "20170910", "accept": "现金", "status": "成功", "channelName": "a通道" }, { "oppName": "郭靖", "oppNo": "12345677", "bankName": "中国农业银行", "amt": 180, "buildDate": "2017-09-18", "buildTime": "15:58:03", "acceptNo": "170918", "journal": "20170910", "accept": "现金", "status": "成功", "channelName": "d通道" }, { "oppName": "洪七公", "oppNo": "123456787", "bankName": "中国建设银行", "amt": 180, "buildDate": "2017-09-18", "buildTime": "15:58:03", "acceptNo": "170918", "journal": "20170910", "accept": "支付宝", "status": "成功", "channelName": "b通道" }, { "oppName": "乔峰", "oppNo": "12855678", "bankName": "中国工商银行", "amt": 180, "buildDate": "2017-09-18", "buildTime": "15:58:03", "acceptNo": "170918", "journal": "20170910", "accept": "微信", "status": "成功", "channelName": "c通道" }, ]
只需要取出value值组成新数组即可。
var arr = [] for (let index = 0; index < data.length; index++) { var obj = data[index]; var item = Object.values(obj);//es6语法,取出对象的value值 arr.push(item); }
console.log(arr)//[["杨过", "12345678", "中国银行", 180, "2017-09-18", "15:58:03", "170918", "20170910", "现金", "成功", "a通道"],
["郭靖", "12345677", "中国农业银行", 180, "2017-09-18", "15:58:03", "170918", "20170910", "现金", "成功", "d通道"],...]
如此一来,只需要遍历arr的值渲染到页面即可。
以上是关于如何用模板渲染后台返回不确定的data的主要内容,如果未能解决你的问题,请参考以下文章
ASP如何用Ajax实现无刷新读取数据库信息(后台发布信息,前台不刷新也能看到)