feat(Tabbar): add @tabbar-z-index less var

This commit is contained in:
陈嘉涵 2020-01-28 11:50:50 +08:00
parent a2d870ad8e
commit 0441f7ba09
5 changed files with 16 additions and 17 deletions

View File

@ -687,6 +687,7 @@
// Tabbar
@tabbar-height: 50px;
@tabbar-z-index: 1;
@tabbar-background-color: @white;
// TabbarItem

View File

@ -9,6 +9,7 @@ export default createComponent({
props: {
route: Boolean,
zIndex: Number,
activeColor: String,
inactiveColor: String,
safeAreaInsetBottom: Boolean,
@ -24,10 +25,6 @@ export default createComponent({
type: Boolean,
default: true,
},
zIndex: {
type: Number,
default: 1,
},
},
watch: {

View File

@ -1,6 +1,7 @@
@import '../style/var';
.van-tabbar {
z-index: @tabbar-z-index;
display: flex;
box-sizing: content-box;
width: 100%;

View File

@ -3,7 +3,7 @@
exports[`renders demo correctly 1`] = `
<div>
<div>
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item van-tabbar-item--active">
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
<!----></i>
@ -35,7 +35,7 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div>
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item van-tabbar-item--active">
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
<!----></i>
@ -75,7 +75,7 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div>
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item van-tabbar-item--active">
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
<!----></i>
@ -111,7 +111,7 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div>
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item van-tabbar-item--active">
<div class="van-tabbar-item__icon"><img src="https://img.yzcdn.cn/vant/user-active.png">
<div class="van-info">3</div>
@ -135,7 +135,7 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div>
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item van-tabbar-item--active" style="color: rgb(7, 193, 96);">
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
<!----></i>
@ -167,7 +167,7 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div>
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item van-tabbar-item--active">
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
<!----></i>

View File

@ -1,9 +1,9 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`disable border 1`] = `<div class="van-tabbar van-tabbar--fixed" style="z-index: 1;"></div>`;
exports[`disable border 1`] = `<div class="van-tabbar van-tabbar--fixed"></div>`;
exports[`route mode 1`] = `
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item van-tabbar-item--active">
<div class="van-tabbar-item__icon">
<!---->
@ -40,7 +40,7 @@ exports[`route mode 1`] = `
`;
exports[`route mode 2`] = `
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item">
<div class="van-tabbar-item__icon">
<!---->
@ -77,7 +77,7 @@ exports[`route mode 2`] = `
`;
exports[`route mode 3`] = `
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item">
<div class="van-tabbar-item__icon">
<!---->
@ -114,7 +114,7 @@ exports[`route mode 3`] = `
`;
exports[`route mode match by name 1`] = `
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item van-tabbar-item--active">
<div class="van-tabbar-item__icon">
<!---->
@ -135,7 +135,7 @@ exports[`route mode match by name 1`] = `
`;
exports[`route mode match by name 2`] = `
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item">
<div class="van-tabbar-item__icon">
<!---->
@ -156,7 +156,7 @@ exports[`route mode match by name 2`] = `
`;
exports[`watch tabbar value 1`] = `
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item">
<div class="van-tabbar-item__icon">
<!---->