casitem.vue
2.37 KB
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
<template>
<li :class="classes">
{{ data.label }}
<Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" v-if="showArrow" />
<i v-if="showLoading" class="ivu-icon ivu-icon-ios-loading ivu-load-loop ivu-cascader-menu-item-loading"></i>
</li>
</template>
<script>
import Icon from '../icon/icon.vue';
export default {
name: 'Casitem',
components: { Icon },
props: {
data: Object,
prefixCls: String,
tmpItem: Object
},
computed: {
classes () {
return [
`${this.prefixCls}-menu-item`,
{
[`${this.prefixCls}-menu-item-active`]: this.tmpItem.value === this.data.value,
[`${this.prefixCls}-menu-item-disabled`]: this.data.disabled
}
];
},
showArrow () {
return (this.data.children && this.data.children.length) || ('loading' in this.data && !this.data.loading);
},
showLoading () {
return 'loading' in this.data && this.data.loading;
},
// 3.4.0, global setting customArrow 有值时，arrow 赋值空
arrowType () {
let type = 'ios-arrow-forward';
if (this.$IVIEW) {
if (this.$IVIEW.cascader.customItemArrow) {
type = '';
} else if (this.$IVIEW.cascader.itemArrow) {
type = this.$IVIEW.cascader.itemArrow;
}
}
return type;
},
// 3.4.0, global setting
customArrowType () {
let type = '';
if (this.$IVIEW) {
if (this.$IVIEW.cascader.customItemArrow) {
type = this.$IVIEW.cascader.customItemArrow;
}
}
return type;
},
// 3.4.0, global setting
arrowSize () {
let size = '';
if (this.$IVIEW) {
if (this.$IVIEW.cascader.itemArrowSize) {
size = this.$IVIEW.cascader.itemArrowSize;
}
}
return size;
}
}
};
</script>