html:

<div id="app1">
<ul>
<li v-for="item in datas">
<div href="">
<div v-text="item.time"></div>
<div href="" v-for="item1 in item.list">
<div v-text="item1.type"></div>
<div v-text="item1.money"></div>
</div>
</div>
</li>
</ul>
</div>

  JS:

var vmm=new Vue({
el: "#app1",
data: {
datas: [] },
mounted:function(){
this.showData();
//需要执行的方法可以在mounted中进行触发,其获取的数据可以赋到data中后,可以放在前面进行渲染
},
methods:{
showData:function () {
jQuery.ajax({
type: 'Get',
url: "data-data.json",
// data:{type:type,ext:ext},
datatype:"json",
success: function (data) {
for(var i=0;i<data.length;i++){
vmm.datas.push(data[i]);
}
console.log(vum.datas);
}
}
});

  data-data.json:

[
{
"time":"2017-10-10",
"list":[
{"type":"消费(订单号101010101010)","money":"99.00"},
{"type":"储值(订单号101010101010)","money":"78.00"},
{"type":"退款(订单号101010101010)","money":"66.00"}
]
},
{
"time":"2017-08-16",
"list":[
{"type":"消费(订单号101010101010)","money":"99.00"},
{"type":"储值(订单号101010101010)","money":"78.00"},
{"type":"退款(订单号101010101010)","money":"66.00"}
]
},
{
"time":"2017-07-16",
"list":[
{"type":"消费(订单号101010101010)","money":"99.00"},
{"type":"储值(订单号101010101010)","money":"78.00"},
{"type":"退款(订单号101010101010)","money":"66.00"}
]
}
]

  https://www.cnblogs.com/yg_zhang/p/6158612.html

https://blog.csdn.net/qq_39740187/article/details/77369749

随机推荐

  1. 获取app-package和app-activity的值

    方法一 原文链接:http://mp.weixin.qq.com/s/KTkfmibSoaGOmDazJmZ8Sw 利用appium图形界面和已有的apk文件获取package和activity. 点 ...

  2. Windows窗口程序从创建到关闭产生的消息

    Windows是消息驱动的,理解消息机制及消息循环是特别重要.知道在什么情况下产生什么消息会让我们对程序有更好的控制.Windows给应用程序发消息,有些会加入应用程序的消息队列,也是就是队列消息.有 ...

  3. [haoi2008]玩具命名

    某人有一套玩具,并想法给玩具命名.首先他选择WING四个字母中的任意一个字母作为玩具的基本名字.然后他会根据自己的喜好,将名字中任意一个字母用“WING”中任意两个字母代替,使得自己的名字能够扩充得很 ...

  4. Alsa中PCM参数设置⭐⭐

    1) PCM设备的句柄.2) 指定同时可供回放或截获的PCM流的方向3) 提供一些关于我们想要使用的设置选项的信息,比如缓冲区大小,采样率,PCM数据格式等4) 检查硬件是否支持设置选项.   4.1 ...

  5. php的CURL使用及例子

    使用PHP的cURL库可以简单和有效地去抓网页.你只需要运行一个脚本,然后分析一下你所抓取的网页,然后就可以以程序的方式得到你想要的数据了.无论是你想从从一个链接上取部分数据,或是取一个XML文件并把 ...

  6. CodeForces813E:Army Creation (主席树---上一题的加强版)

    As you might remember from our previous rounds, Vova really likes computer games. Now he is playing ...

  7. testing

    doctest_test.py def square(x): ''' 这里需要空格 >>> square(2) 4 啦啦 >>> square(3) 9 上不一行能 ...

  8. 图片轮播和C3动画

    值得注意的地方是:如果在图片下面的li做背景图片,可以把li上的数字或者文本设置为transparent(透明色),这样的话既可以实现轮播的定时器效果,也可以让li上有C3动画效果.如果li上的文字不 ...

  9. java+poi实现word转html显示

    直入正题,需求为页面预览word文档,用的是poi3.8,以下代码支持表格.图片,不支持分页,只支持doc,不支持docx: 1.导jar包 2.java文件 /** * */ import java ...

  10. android性能测试工具

    Android性能测试工具Emmagee介绍   Emmagee介绍 Emmagee是监控指定被测应用在使用过程中占用机器的CPU.内存.流量资源的性能测试小工具.该工具的优势在于如同windows系 ...