alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

[improvement] Tabs: jsx (#2665)

Browse Source
This commit is contained in:
neverland
2019-02-01 17:58:06 +08:00
committed by GitHub
parent c010ee22ac
commit 7ee383129c
6 changed files with 265 additions and 170 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/tab/index.js
+1 -1
View File
@@ -60,7 +60,7 @@ export default sfc({
const slots = this.$slots;
return (
<div v-show={this.selected || this.parent.animated} class={bem('pane')}>
{this.inited && slots.default}
{this.inited ? slots.default : h()}
{slots.title && <div ref="title">{slots.title}</div>}
</div>
);
packages/tab/test/__snapshots__/demo.spec.js.snap
+147 -83
View File
@@ -10,85 +10,18 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
</div>
</div>
</div>
<div>
<div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom">
<div class="van-tabs__nav van-tabs__nav--line" style="border-color:undefined;">
<div class="van-tabs__line" style="background-color:undefined;"></div>
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
</div>
</div>
</div>
<div>
<div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom">
<div class="van-tabs__nav van-tabs__nav--line" style="border-color:undefined;">
<div class="van-tabs__line" style="background-color:undefined;"></div>
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
</div>
</div>
</div>
<div>
<div class="van-tabs van-tabs--card">
<div class="van-tabs__wrap">
<div class="van-tabs__nav van-tabs__nav--card" style="border-color:undefined;">
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
</div>
</div>
</div>
<div>
<div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom">
<div class="van-tabs__nav van-tabs__nav--line" style="border-color:undefined;">
<div class="van-tabs__line" style="background-color:undefined;"></div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
</div>
</div>
</div>
<div>
<div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom">
<div class="van-tabs__nav van-tabs__nav--line" style="border-color:undefined;">
<div class="van-tabs__line" style="background-color:undefined;"></div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
</div>
</div>
</div>
@@ -101,6 +34,120 @@ exports[`renders demo correctly 1`] = `
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
</div>
</div>
</div>
<div>
<div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom">
<div class="van-tabs__nav van-tabs__nav--line" style="border-color:undefined;">
<div class="van-tabs__line" style="background-color:undefined;"></div>
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
</div>
</div>
</div>
<div>
<div class="van-tabs van-tabs--card">
<div class="van-tabs__wrap">
<div class="van-tabs__nav van-tabs__nav--card" style="border-color:undefined;"></div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
</div>
</div>
</div>
<div>
<div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom">
<div class="van-tabs__nav van-tabs__nav--line" style="border-color:undefined;">
<div class="van-tabs__line" style="background-color:undefined;"></div>
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
</div>
</div>
</div>
<div>
<div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom">
<div class="van-tabs__nav van-tabs__nav--line" style="border-color:undefined;">
<div class="van-tabs__line" style="background-color:undefined;"></div>
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
</div>
</div>
</div>
<div>
<div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom">
<div class="van-tabs__nav van-tabs__nav--line" style="border-color:undefined;">
<div class="van-tabs__line" style="background-color:undefined;"></div>
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;">
<!---->
<div>
<div><i class="van-icon van-icon-more-o" style="color:undefined;font-size:undefined;">
<!----></i>标签
@@ -108,6 +155,7 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
<div>
<div><i class="van-icon van-icon-more-o" style="color:undefined;font-size:undefined;">
<!----></i>标签
@@ -126,10 +174,18 @@ exports[`renders demo correctly 1`] = `
</div>
<div class="van-tabs__content van-tabs__content--animated">
<div class="van-tabs__track" style="left:0%;transition-duration:0.3s;">
<div class="van-tab__pane"></div>
<div class="van-tab__pane"></div>
<div class="van-tab__pane"></div>
<div class="van-tab__pane"></div>
<div class="van-tab__pane">
<!---->
</div>
<div class="van-tab__pane">
<!---->
</div>
<div class="van-tab__pane">
<!---->
</div>
<div class="van-tab__pane">
<!---->
</div>
</div>
</div>
</div>
@@ -142,10 +198,18 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;"></div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
<div class="van-tab__pane" style="display:none;">
<!---->
</div>
</div>
</div>
</div>
packages/tab/test/__snapshots__/index.spec.js.snap
+49 -16
View File
@@ -8,11 +8,16 @@ exports[`change tabs data 1`] = `
</div>
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display: none;"></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 class="van-tab__pane" style="display: none;">
<!---->
</div>
</div>
</div>
`;
@@ -31,8 +36,12 @@ exports[`change tabs data 2`] = `
</div>
<div class="van-tabs__content">
<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 class="van-tab__pane" style="display: none;">
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
</div>
</div>
</div>
`;
@@ -51,8 +60,12 @@ exports[`click to switch tab 1`] = `
</div>
<div class="van-tabs__content">
<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 class="van-tab__pane" style="display: none;">
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
</div>
</div>
</div>
`;
@@ -71,8 +84,12 @@ exports[`click to switch tab 2`] = `
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display: none;">Text</div>
<div class="van-tab__pane" style=""></div>
<div class="van-tab__pane" style="display: none;"></div>
<div class="van-tab__pane" style="">
Text
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
</div>
</div>
</div>
`;
@@ -91,8 +108,12 @@ exports[`swipe to switch tab 1`] = `
</div>
<div class="van-tabs__content">
<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 class="van-tab__pane" style="display: none;">
<!---->
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
</div>
</div>
</div>
`;
@@ -111,8 +132,12 @@ exports[`swipe to switch tab 2`] = `
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display: none;">Text</div>
<div class="van-tab__pane" style=""></div>
<div class="van-tab__pane" style="display: none;"></div>
<div class="van-tab__pane" style="">
Text
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
</div>
</div>
</div>
`;
@@ -131,8 +156,12 @@ exports[`swipe to switch tab 3`] = `
</div>
<div class="van-tabs__content">
<div class="van-tab__pane" style="display: none;">Text</div>
<div class="van-tab__pane" style=""></div>
<div class="van-tab__pane" style="display: none;"></div>
<div class="van-tab__pane" style="">
Text
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
</div>
</div>
</div>
`;
@@ -151,8 +180,12 @@ exports[`swipe to switch tab 4`] = `
</div>
<div class="van-tabs__content">
<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 class="van-tab__pane" style="display: none;">
Text
</div>
<div class="van-tab__pane" style="display: none;">
<!---->
</div>
</div>
</div>
`;