[improvement] Tab: optimize animated tab (#2302)

This commit is contained in:
neverland
2018-12-16 15:18:14 +08:00
committed by GitHub
parent e2c4d60058
commit 347e980da9
6 changed files with 211 additions and 271 deletions
@@ -8,19 +8,17 @@ exports[`change tabs data 1`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tabs__track" style="left: 0%;">
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<!---->
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<div><span>title2</span></div>
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<div><span>title2</span></div>
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<!---->
</div>
</div>
</div>
@@ -43,19 +41,17 @@ exports[`change tabs data 2`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tabs__track" style="left: 0%;">
<div class="van-tab__pane van-tab__pane--active">
<!---->
<!---->
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<div><span>title2</span></div>
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<!---->
</div>
<div class="van-tab__pane" style="">
<!---->
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<div><span>title2</span></div>
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<!---->
</div>
</div>
</div>
@@ -78,17 +74,15 @@ exports[`click to switch tab 1`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tabs__track" style="left: 0%;">
<div class="van-tab__pane van-tab__pane--active">Text
<!---->
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<!---->
</div>
<div class="van-tab__pane" style="">Text
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<!---->
</div>
</div>
</div>
@@ -111,17 +105,15 @@ exports[`click to switch tab 2`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tabs__track" style="left: -100%;">
<div class="van-tab__pane van-tab__pane--inactive">Text
<!---->
</div>
<div class="van-tab__pane van-tab__pane--active">
Text
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<!---->
</div>
<div class="van-tab__pane" style="display: none;">Text
<!---->
</div>
<div class="van-tab__pane" style="">
Text
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<!---->
</div>
</div>
</div>
@@ -144,17 +136,15 @@ exports[`swipe to switch tab 1`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tabs__track" style="left: 0%;">
<div class="van-tab__pane van-tab__pane--active">Text
<!---->
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<!---->
</div>
<div class="van-tab__pane" style="">Text
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<!---->
</div>
</div>
</div>
@@ -177,17 +167,15 @@ exports[`swipe to switch tab 2`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tabs__track" style="left: -100%;">
<div class="van-tab__pane van-tab__pane--inactive">Text
<!---->
</div>
<div class="van-tab__pane van-tab__pane--active">
Text
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<!---->
</div>
<div class="van-tab__pane" style="display: none;">Text
<!---->
</div>
<div class="van-tab__pane" style="">
Text
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<!---->
</div>
</div>
</div>
@@ -210,17 +198,15 @@ exports[`swipe to switch tab 3`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tabs__track" style="left: -100%;">
<div class="van-tab__pane van-tab__pane--inactive">Text
<!---->
</div>
<div class="van-tab__pane van-tab__pane--active">
Text
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<!---->
</div>
<div class="van-tab__pane" style="display: none;">Text
<!---->
</div>
<div class="van-tab__pane" style="">
Text
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<!---->
</div>
</div>
</div>
@@ -243,17 +229,15 @@ exports[`swipe to switch tab 4`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tabs__track" style="left: 0%;">
<div class="van-tab__pane van-tab__pane--active">Text
<!---->
</div>
<div class="van-tab__pane van-tab__pane--inactive">
Text
</div>
<div class="van-tab__pane van-tab__pane--inactive">
<!---->
<!---->
</div>
<div class="van-tab__pane" style="">Text
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
Text
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
<!---->
</div>
</div>
</div>