-
Notifications
You must be signed in to change notification settings - Fork 10
/
index.shtml
59 lines (59 loc) · 1.57 KB
/
index.shtml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>cnNodeJs.Org data & vue By FungLeo</title>
<meta name="keywords" content="cnNodeJs,vue,FungLeo">
<meta name="description" content="本页面是获取cnNodeJs公开API数据，通过vuejs进行渲染的DOME页面。用来展示FungLeo的前端技能。">
<!--#include virtual="inc/head.html"-->
</head>
<body>
<!--#include virtual="inc/header.html"-->
<section class="home">
<section class="main">
<ul class="list">
<li v-for="info in data">
<i class="user_ico">
<img v-bind:src="info.author.avatar_url" v-bind:alt="info.author.loginname">
<span v-text="info.author.loginname"></span>
</i>
<time class="time" v-text="info.create_at | time"></time>
<a class="talk" href="content.shtml?{{ info.id }}">{{ info.title }}</a>
</li>
</ul>
<div class="page"></div>
</section>
<!--#include virtual="inc/bar.html"-->
</section>
<!--#include virtual="inc/footer.html"-->
</body>
</html>
<script>
$(function(){
var id = getUrlId();
var url = "http://cnodejs.org/api/v1/topics?page="+id;
getJson(url,pushDom);
laypage({
cont: $(".page"),
pages: 100,
curr: id,
jump: function(e, first){ //触发分页后的回调
if(!first){ //一定要加此判断，否则初始时会无限刷新
location.href = '?'+e.curr;
}
}
});
})
function pushDom(data){
/*
使用vue自定义过滤器把接口中传过来的时间进行整形
*/
Vue.filter('time', function (value) {
return goodTime(value);
})
var vm = new Vue({
el: '.list',
data: data
});
}
</script>