DataIcons 数据展示
... 2021-7-29 Less than 1 minute
# DataIcons 数据展示
<avue-data-icons :option="option"></avue-data-icons>
<script>
export default {
data(){
return {
option: {
span:4,
data: [
{
click: function (item) {
alert(JSON.stringify(item));
},
title: '今日注册',
count: 12678,
decimals:2,
icon: 'el-icon-tickets',
href:'https://avuejs.com',
target:'_blank'
},
{
click: function (item) {
alert(JSON.stringify(item));
},
title: '今日登录',
count: 22139,
icon: 'el-icon-success',
href:'https://avuejs.com',
target:'_blank'
},
{
click: function (item) {
alert(JSON.stringify(item));
},
title: '今日订阅',
count: 35623,
icon: 'el-icon-info',
href:'https://avuejs.com',
target:'_blank'
},
{
click: function (item) {
alert(JSON.stringify(item));
},
title: '今日评论',
count: 16826,
icon: 'el-icon-message',
href:'https://avuejs.com',
target:'_blank'
},
{
click: function (item) {
alert(JSON.stringify(item));
},
title: '今日评论',
count: 16826,
icon: 'el-icon-message',
href:'https://avuejs.com',
target:'_blank'
},
{
click: function (item) {
alert(JSON.stringify(item));
},
title: '今日评论',
count: 16826,
icon: 'el-icon-message',
href:'https://avuejs.com',
target:'_blank'
}
]
},
}
}
}
</script>
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
Expand Copy Copy
# Attributes
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| animation | 是否动画 | Boolean | false/true | true |
| decimals | 小数点位数 | Number | — | 0 |
| span | 栅格数 | String | — | 8 |
| data | 数据 | Array | — | - |