[bugfix] Tab: should lazy render tab-pane

This commit is contained in:
nrz 2018-05-05 22:18:47 +08:00 committed by neverland
parent 9a3634838b
commit a85747a248
2 changed files with 22 additions and 10 deletions

View File

@ -1,6 +1,8 @@
<template>
<div :class="b('pane', { select: index === parent.curActive })">
<slot />
<div :class="b('pane')" v-show="isSelected">
<keep-alive>
<slot v-if="isSelected || slotInited" />
</keep-alive>
</div>
</template>
@ -18,9 +20,27 @@ export default create({
disabled: Boolean
},
data() {
return {
slotInited: false
};
},
computed: {
index() {
return this.parent.tabs.indexOf(this);
},
isSelected() {
return this.index === this.parent.curActive;
}
},
watch: {
'parent.curActive'() {
if (this.isSelected) {
this.slotInited = true;
}
}
},

View File

@ -134,12 +134,4 @@ $van-tabs-card-height: 30px;
background-color: $white;
}
}
&__pane {
display: none;
&--select {
display: block;
}
}
}