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
77
78
79
80
81
82
83
84
| <template>
| <div :class="classes">
| <div class="ivu-list-header" v-if="header || $slots.header"><slot name="header">{{ header }}</slot></div>
| <div class="ivu-list-container">
| <ul class="ivu-list-items"><slot></slot></ul>
| </div>
| <Spin v-if="loading" fix size="large"><slot name="spin"></slot></Spin>
| <div class="ivu-list-footer" v-if="footer || $slots.footer"><slot name="footer">{{ footer }}</slot></div>
| </div>
| </template>
| <script>
| import { oneOf } from '../../utils/assist';
|
| const prefixCls = 'ivu-list';
|
| export default {
| name: 'List',
| provide () {
| return {
| ListInstance: this
| };
| },
| props: {
| border: {
| type: Boolean,
| default: false
| },
| itemLayout: {
| validator (value) {
| return oneOf(value, ['horizontal', 'vertical']);
| },
| default: 'horizontal'
| },
| // 或 slot
| header: {
| type: String,
| default: ''
| },
| // 或 slot
| footer: {
| type: String,
| default: ''
| },
| // 含 slot: spin
| loading: {
| type: Boolean,
| default: false
| },
| size: {
| validator (value) {
| return oneOf(value, ['small', 'large', 'default']);
| },
| default () {
| return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
| }
| },
| split: {
| type: Boolean,
| default: true
| }
| },
| data () {
| return {
|
| };
| },
| computed: {
| classes () {
| return [
| `${prefixCls}`,
| `${prefixCls}-${this.size}`,
| `${prefixCls}-${this.itemLayout}`,
| {
| [`${prefixCls}-bordered`]: this.border,
| [`${prefixCls}-split`]: this.split
| }
| ];
| },
| },
| methods: {
|
| }
| };
| </script>
|
|