blackteay/vant-weapp
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant-weapp.git synced 2025-04-06 03:58:05 +08:00
Code Issues Projects Releases Wiki Activity

[build] 0.5.5

Browse Source
This commit is contained in:
rex-zsd 2019-02-26 18:13:02 +08:00
parent ff94a7d6cd
commit 945f021bec
15 changed files with 197 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dist/button/index.wxss vendored
View File

@ -1 +1 @@
@import '../common/index.wxss';.van-button{position:relative;display:inline-block;height:44px;padding:0;font-size:16px;line-height:42px;text-align:center;-webkit-text-size-adjust:100%;vertical-align:middle;border-radius:2px;box-sizing:border-box;-webkit-appearance:none}.van-button::after{position:absolute;top:50%;left:50%;width:100%;height:100%;background-color:#000;border:inherit;border-color:#000;border-radius:inherit;content:' ';opacity:0;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.van-button--active::after{opacity:.15}.van-button--unclickable::after{display:none}.van-button--default{color:#333;background-color:#fff;border:1px solid #eee}.van-button--primary{color:#fff;background-color:#07c160;border:1px solid #07c160}.van-button--danger{color:#fff;background-color:#f44;border:1px solid #f44}.van-button--warning{color:#fff;background-color:#ff976a;border:1px solid #ff976a}.van-button--plain{background-color:#fff}.van-button--plain.van-button--primary{color:#07c160}.van-button--plain.van-button--danger{color:#f44}.van-button--plain.van-button--warning{color:#ff976a}.van-button--large{width:100%;height:50px;line-height:48px}.van-button--normal{padding:0 15px;font-size:14px}.van-button--small{height:30px;min-width:60px;padding:0 8px;font-size:12px;line-height:28px}.van-button--mini{display:inline-block;width:50px;height:22px;font-size:10px;line-height:20px}.van-button--mini+.van-button--mini{margin-left:5px}.van-button--block{display:block;width:100%}.van-button--round{border-radius:10em}.van-button--square{border-radius:0}.van-button--disabled{opacity:.5}.van-button__loading-text{margin-left:5px;display:inline-block;vertical-align:middle}
@import '../common/index.wxss';.van-button{position:relative;display:inline-block;height:44px;padding:0;font-size:16px;line-height:42px;text-align:center;-webkit-text-size-adjust:100%;vertical-align:middle;border-radius:2px;box-sizing:border-box;-webkit-appearance:none}.van-button::after{position:absolute;top:50%;left:50%;width:100%;height:100%;background-color:#000;border:inherit;border-color:#000;border-radius:inherit;content:' ';opacity:0;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.van-button--active::after{opacity:.15}.van-button--unclickable::after{display:none}.van-button--default{color:#333;background-color:#fff;border:1px solid #eee}.van-button--primary{color:#fff;background-color:#07c160;border:1px solid #07c160}.van-button--info{color:#fff;background-color:#1989fa;border:1px solid #1989fa}.van-button--danger{color:#fff;background-color:#f44;border:1px solid #f44}.van-button--warning{color:#fff;background-color:#ff976a;border:1px solid #ff976a}.van-button--plain{background-color:#fff}.van-button--plain.van-button--primary{color:#07c160}.van-button--plain.van-button--info{color:#1989fa}.van-button--plain.van-button--danger{color:#f44}.van-button--plain.van-button--warning{color:#ff976a}.van-button--large{width:100%;height:50px;line-height:48px}.van-button--normal{padding:0 15px;font-size:14px}.van-button--small{height:30px;min-width:60px;padding:0 8px;font-size:12px;line-height:28px}.van-button--mini{display:inline-block;width:50px;height:22px;font-size:10px;line-height:20px}.van-button--mini+.van-button--mini{margin-left:5px}.van-button--block{display:block;width:100%}.van-button--round{border-radius:10em}.van-button--square{border-radius:0}.van-button--disabled{opacity:.5}.van-button__loading-text{margin-left:5px;display:inline-block;vertical-align:middle}

90
dist/mixins/transition.js vendored
View File

@ -1,3 +1,18 @@
import { isObj } from '../common/utils';
var getClassNames = function getClassNames(name) {
return {
enter: "van-" + name + "-enter van-" + name + "-enter-active enter-class enter-active-class",
'enter-to': "van-" + name + "-enter-to van-" + name + "-enter-active enter-to-class enter-active-class",
leave: "van-" + name + "-leave van-" + name + "-leave-active leave-class leave-active-class",
'leave-to': "van-" + name + "-leave-to van-" + name + "-leave-active leave-to-class leave-active-class"
};
};
var requestAnimationFrame = function requestAnimationFrame(cb) {
return setTimeout(cb, 1000 / 60);
};
export var transition = function transition(showDefaultValue) {
return Behavior({
properties: {
@ -8,60 +23,77 @@ export var transition = function transition(showDefaultValue) {
observer: 'observeShow'
},
duration: {
type: Number,
value: 300
type: [Number, Object],
value: 300,
observer: 'observeDuration'
},
name: {
type: String,
value: 'fade',
observer: 'updateClasses'
}
},
data: {
type: '',
inited: false,
display: false,
supportAnimation: true
classNames: getClassNames('fade')
},
attached: function attached() {
if (this.data.show) {
this.show();
}
this.detectSupport();
},
methods: {
detectSupport: function detectSupport() {
var _this = this;
wx.getSystemInfo({
success: function success(info) {
if (info && info.system && info.system.indexOf('iOS 8') === 0) {
_this.set({
supportAnimation: false
});
}
}
});
},
observeShow: function observeShow(value) {
if (value) {
this.show();
} else {
if (this.data.supportAnimation) {
this.set({
type: 'leave'
});
} else {
this.set({
display: false
});
}
this.leave();
}
},
updateClasses: function updateClasses(name) {
this.set({
classNames: getClassNames(name)
});
},
show: function show() {
var _this = this;
var _this$data = this.data,
classNames = _this$data.classNames,
duration = _this$data.duration;
this.set({
inited: true,
display: true,
type: 'enter'
classes: classNames.enter,
currentDuration: isObj(duration) ? duration.enter : duration
}).then(function () {
requestAnimationFrame(function () {
_this.set({
classes: classNames['enter-to']
});
});
});
},
onAnimationEnd: function onAnimationEnd() {
leave: function leave() {
var _this2 = this;
var _this$data2 = this.data,
classNames = _this$data2.classNames,
duration = _this$data2.duration;
this.set({
classes: classNames.leave,
currentDuration: isObj(duration) ? duration.leave : duration
}).then(function () {
requestAnimationFrame(function () {
_this2.set({
classes: classNames['leave-to']
});
});
});
},
onTransitionEnd: function onTransitionEnd() {
if (!this.data.show) {
this.set({
display: false

2
dist/notify/index.wxss vendored
View File

@ -1 +1 @@
@import '../common/index.wxss';.van-notify{z-index:110;position:fixed;top:0;width:100%;text-align:center;box-sizing:border-box;padding:6px 15px;font-size:14px;line-height:20px}
@import '../common/index.wxss';.van-notify{position:fixed;top:0;z-index:110;width:100%;padding:6px 15px;font-size:14px;line-height:20px;text-align:center;word-break:break-all;box-sizing:border-box}

4
dist/overlay/index.js vendored
View File

@ -4,6 +4,10 @@ VantComponent({
show: Boolean,
mask: Boolean,
customStyle: String,
duration: {
type: [Number, Object],
value: 300
},
zIndex: {
type: Number,
value: 1

1
dist/overlay/index.wxml vendored
View File

@ -2,6 +2,7 @@
show="{{ show }}"
custom-class="van-overlay"
custom-style="z-index: {{ zIndex }}; {{ mask ? 'background-color: rgba(0, 0, 0, .7);' : '' }}; {{ customStyle }}"
duration="{{ duration }}"
bind:tap="onClick"
catch:touchmove="noop"
/>

2
dist/overlay/index.wxss vendored
View File

@ -1 +1 @@
@import '../common/index.wxss';.van-overlay{position:fixed;top:0;left:0;right:0;bottom:0}
@import '../common/index.wxss';.van-overlay{position:fixed;top:0;right:0;bottom:0;left:0}

18
dist/popup/index.js vendored
View File

@ -2,9 +2,13 @@ import { VantComponent } from '../common/component';
import { transition } from '../mixins/transition';
import { iphonex } from '../mixins/iphonex';
VantComponent({
classes: ['enter-class', 'enter-active-class', 'enter-to-class', 'leave-class', 'leave-active-class', 'leave-to-class'],
mixins: [transition(false), iphonex],
props: {
transition: String,
transition: {
type: String,
observer: 'observeClass'
},
customStyle: String,
overlayStyle: String,
zIndex: {
@ -21,9 +25,13 @@ VantComponent({
},
position: {
type: String,
value: 'center'
value: 'center',
observer: 'observeClass'
}
},
created: function created() {
this.observeClass();
},
methods: {
onClickOverlay: function onClickOverlay() {
this.$emit('click-overlay');
@ -31,6 +39,12 @@ VantComponent({
if (this.data.closeOnClickOverlay) {
this.$emit('close');
}
},
observeClass: function observeClass() {
var _this$data = this.data,
transition = _this$data.transition,
position = _this$data.position;
this.updateClasses(transition || position);
}
}
});

7
dist/popup/index.wxml vendored
View File

@ -6,13 +6,14 @@
show="{{ show }}"
z-index="{{ zIndex }}"
custom-style="{{ overlayStyle }}"
duration="{{ duration }}"
bind:click="onClickOverlay"
/>
<view
wx:if="{{ inited }}"
class="custom-class {{ utils.bem('popup', [position, { safe: isIPhoneX && safeAreaInsetBottom && position === 'bottom' }]) }}"
style="z-index: {{ zIndex }}; -webkit-animation: van-{{ transition || position }}-{{ type }} {{ duration }}ms both; animation: van-{{ transition || position }}-{{ type }} {{ duration }}ms both; {{ display ? '' : 'display: none;' }}{{ customStyle }}"
bind:animationend="onAnimationEnd"
class="custom-class {{ classes }} {{ utils.bem('popup', [position, { safe: isIPhoneX && safeAreaInsetBottom && position === 'bottom' }]) }}"
style="z-index: {{ zIndex }}; -webkit-transition-duration:{{ currentDuration }}ms; transition-duration:{{ currentDuration }}ms; {{ display ? '' : 'display: none;' }} {{ customStyle }}"
bind:transitionend="onTransitionEnd"
>
<slot />
</view>

2
dist/popup/index.wxss vendored
View File

@ -1 +1 @@
@import '../common/index.wxss';.van-popup{top:50%;left:50%;position:fixed;max-height:100%;overflow-y:auto;box-sizing:border-box;background-color:#fff;-webkit-overflow-scrolling:touch;-webkit-animation:ease both;animation:ease both}.van-popup--center{-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}.van-popup--top{width:100%;top:0;right:auto;bottom:auto;left:50%}.van-popup--right{top:50%;right:0;bottom:auto;left:auto}.van-popup--bottom{width:100%;top:auto;bottom:0;right:auto;left:50%}.van-popup--left{top:50%;right:auto;bottom:auto;left:0}.van-popup--safe{padding-bottom:34px}@-webkit-keyframes van-center-enter{from{opacity:0}}@keyframes van-center-enter{from{opacity:0}}@-webkit-keyframes van-center-leave{to{opacity:0}}@keyframes van-center-leave{to{opacity:0}}@-webkit-keyframes van-scale-enter{from{opacity:0;-webkit-transform:translate3d(-50%,-50%,0) scale(.7);transform:translate3d(-50%,-50%,0) scale(.7)}}@keyframes van-scale-enter{from{opacity:0;-webkit-transform:translate3d(-50%,-50%,0) scale(.7);transform:translate3d(-50%,-50%,0) scale(.7)}}@-webkit-keyframes van-scale-leave{to{opacity:0;-webkit-transform:translate3d(-50%,-50%,0) scale(.7);transform:translate3d(-50%,-50%,0) scale(.7)}}@keyframes van-scale-leave{to{opacity:0;-webkit-transform:translate3d(-50%,-50%,0) scale(.7);transform:translate3d(-50%,-50%,0) scale(.7)}}@-webkit-keyframes van-bottom-enter{from{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}to{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}}@keyframes van-bottom-enter{from{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}to{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}}@-webkit-keyframes van-bottom-leave{from{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}to{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}}@keyframes van-bottom-leave{from{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}to{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}}@-webkit-keyframes van-top-enter{from{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}to{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}}@keyframes van-top-enter{from{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}to{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}}@-webkit-keyframes van-top-leave{from{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}to{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}}@keyframes van-top-leave{from{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}to{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}}@-webkit-keyframes van-left-enter{from{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}to{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}}@keyframes van-left-enter{from{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}to{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}}@-webkit-keyframes van-left-leave{from{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}to{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}}@keyframes van-left-leave{from{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}to{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}}@-webkit-keyframes van-right-enter{from{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}to{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}}@keyframes van-right-enter{from{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}to{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}}@-webkit-keyframes van-right-leave{from{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}to{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}}@keyframes van-right-leave{from{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}to{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}}
@import '../common/index.wxss';.van-popup{position:fixed;top:50%;left:50%;max-height:100%;overflow-y:auto;background-color:#fff;box-sizing:border-box;-webkit-animation:ease both;animation:ease both;-webkit-overflow-scrolling:touch;transition-timing-function:ease}.van-popup--center{-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}.van-popup--top{top:0;right:auto;bottom:auto;left:50%;width:100%;-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}.van-popup--right{top:50%;right:0;bottom:auto;left:auto;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.van-popup--bottom{top:auto;right:auto;bottom:0;left:50%;width:100%;-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}.van-popup--left{top:50%;right:auto;bottom:auto;left:0;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.van-popup--safe{padding-bottom:34px}.van-scale-enter-active,.van-scale-leave-active{transition-property:opacity,-webkit-transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform}.van-scale-enter,.van-scale-leave-to{opacity:0;-webkit-transform:translate3d(-50%,-50%,0) scale(.7);transform:translate3d(-50%,-50%,0) scale(.7)}.van-fade-enter-active,.van-fade-leave-active{transition-property:opacity}.van-fade-enter,.van-fade-leave-to{opacity:0}.van-center-enter-active,.van-center-leave-active{transition-property:opacity}.van-center-enter,.van-center-leave-to{opacity:0}.van-bottom-enter-active,.van-bottom-leave-active,.van-left-enter-active,.van-left-leave-active,.van-right-enter-active,.van-right-leave-active,.van-top-enter-active,.van-top-leave-active{transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}.van-bottom-enter,.van-bottom-leave-to{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}.van-top-enter,.van-top-leave-to{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}.van-left-enter,.van-left-leave-to{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}.van-right-enter,.van-right-leave-to{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}

159
dist/tabs/index.js vendored
View File

@ -57,10 +57,6 @@ VantComponent({
offsetTop: {
type: Number,
value: 0
},
scrollTop: {
type: Number,
value: 0
}
},
data: {
@ -83,16 +79,22 @@ VantComponent({
lineHeight: 'setLine',
active: 'setActiveTab',
animated: 'setTrack',
scrollTop: 'onScroll',
offsetTop: 'setWrapStyle'
},
beforeCreate: function beforeCreate() {
this.child = [];
},
mounted: function mounted() {
var _this = this;
this.setLine(true);
this.setTrack();
this.scrollIntoView();
this.getRect('.van-tabs__wrap').then(function (rect) {
_this.navHeight = rect.height;
_this.observerContentScroll();
});
},
destroyed: function destroyed() {
wx.createIntersectionObserver(this).disconnect();
@ -132,7 +134,7 @@ VantComponent({
}
},
setLine: function setLine(skipTransition) {
var _this = this;
var _this2 = this;
if (this.data.type !== 'line') {
return;
@ -154,13 +156,13 @@ VantComponent({
left += (rect.width - width) / 2;
var transition = skipTransition ? '' : "transition-duration: " + duration + "s; -webkit-transition-duration: " + duration + "s;";
_this.set({
_this2.set({
lineStyle: "\n " + height + "\n width: " + width + "px;\n background-color: " + color + ";\n -webkit-transform: translateX(" + left + "px);\n transform: translateX(" + left + "px);\n " + transition + "\n "
});
});
},
setTrack: function setTrack() {
var _this2 = this;
var _this3 = this;
var _this$data2 = this.data,
animated = _this$data2.animated,
@ -170,27 +172,26 @@ VantComponent({
this.getRect('.van-tabs__content').then(function (rect) {
var width = rect.width;
_this2.set({
trackStyle: "\n width: " + width * _this2.child.length + "px;\n left: " + -1 * active * width + "px;\n transition: left " + duration + "s;\n display: flex;\n "
_this3.set({
trackStyle: "\n width: " + width * _this3.child.length + "px;\n left: " + -1 * active * width + "px;\n transition: left " + duration + "s;\n display: -webkit-box;\n display: flex;\n "
});
_this2.setTabsProps({
var props = {
width: width,
animated: animated
};
_this3.child.forEach(function (item) {
item.set(props);
});
});
},
setTabsProps: function setTabsProps(props) {
this.child.forEach(function (item) {
item.set(props);
});
},
setActiveTab: function setActiveTab() {
var _this3 = this;
var _this4 = this;
this.child.forEach(function (item, index) {
var data = {
active: index === _this3.data.active
active: index === _this4.data.active
};
if (data.active) {
@ -202,34 +203,35 @@ VantComponent({
}
});
this.set({}, function () {
_this3.setLine();
_this4.setLine();
_this3.setTrack();
_this4.setTrack();
_this3.scrollIntoView();
_this4.scrollIntoView();
});
},
// scroll active tab into view
scrollIntoView: function scrollIntoView() {
var _this4 = this;
var _this5 = this;
if (!this.data.scrollable) {
var _this$data3 = this.data,
active = _this$data3.active,
scrollable = _this$data3.scrollable;
if (!scrollable) {
return;
}
this.getRect('.van-tab', true).then(function (tabRects) {
var tabRect = tabRects[_this4.data.active];
var offsetLeft = tabRects.slice(0, _this4.data.active).reduce(function (prev, curr) {
Promise.all([this.getRect('.van-tab', true), this.getRect('.van-tabs__nav')]).then(function (_ref) {
var tabRects = _ref[0],
navRect = _ref[1];
var tabRect = tabRects[active];
var offsetLeft = tabRects.slice(0, active).reduce(function (prev, curr) {
return prev + curr.width;
}, 0);
var tabWidth = tabRect.width;
_this4.getRect('.van-tabs__nav').then(function (navRect) {
var navWidth = navRect.width;
_this4.set({
scrollLeft: offsetLeft - (navWidth - tabWidth) / 2
});
_this5.set({
scrollLeft: offsetLeft - (navRect.width - tabRect.width) / 2
});
});
},
@ -244,9 +246,9 @@ VantComponent({
// watch swipe touch end
onTouchEnd: function onTouchEnd() {
if (!this.data.swipeable) return;
var _this$data3 = this.data,
active = _this$data3.active,
tabs = _this$data3.tabs;
var _this$data4 = this.data,
active = _this$data4.active,
tabs = _this$data4.tabs;
var direction = this.direction,
deltaX = this.deltaX,
offsetX = this.offsetX;
@ -261,9 +263,9 @@ VantComponent({
}
},
setWrapStyle: function setWrapStyle() {
var _this$data4 = this.data,
offsetTop = _this$data4.offsetTop,
position = _this$data4.position;
var _ref2 = this.data,
offsetTop = _ref2.offsetTop,
position = _ref2.position;
var wrapStyle;
switch (position) {
@ -285,40 +287,67 @@ VantComponent({
wrapStyle: wrapStyle
});
},
// adjust tab position
onScroll: function onScroll(scrollTop) {
var _this5 = this;
observerContentScroll: function observerContentScroll() {
var _this6 = this;
if (!this.data.sticky) {
return;
}
if (!this.data.sticky) return;
var offsetTop = this.data.offsetTop;
this.getRect('.van-tabs').then(function (rect) {
var top = rect.top,
height = rect.height;
_this5.getRect('.van-tabs__wrap').then(function (rect) {
var wrapHeight = rect.height;
var position = '';
var _wx$getSystemInfoSync = wx.getSystemInfoSync(),
windowHeight = _wx$getSystemInfoSync.windowHeight;
if (offsetTop > top + height - wrapHeight) {
position = 'bottom';
} else if (offsetTop > top) {
position = 'top';
}
wx.createIntersectionObserver(this).relativeToViewport({
top: -this.navHeight
}).observe('.van-tabs', function (res) {
var top = res.boundingClientRect.top;
_this5.$emit('scroll', {
scrollTop: scrollTop + offsetTop,
isFixed: position === 'top'
});
if (top > 0) {
return;
}
if (position !== _this5.data.position) {
_this5.set({
position: position
}, function () {
_this5.setWrapStyle();
});
}
var position = res.intersectionRatio > 0 ? 'top' : 'bottom';
_this6.$emit('scroll', {
scrollTop: top + offsetTop,
isFixed: position === 'top'
});
_this6.setPosition(position);
});
wx.createIntersectionObserver(this).relativeToViewport({
bottom: -(windowHeight - 1)
}).observe('.van-tabs', function (res) {
var _res$boundingClientRe = res.boundingClientRect,
top = _res$boundingClientRe.top,
bottom = _res$boundingClientRe.bottom;
if (bottom < _this6.navHeight) {
return;
}
var position = res.intersectionRatio > 0 ? 'top' : '';
_this6.$emit('scroll', {
scrollTop: top + offsetTop,
isFixed: position === 'top'
});
_this6.setPosition(position);
});
},
setPosition: function setPosition(position) {
var _this7 = this;
if (position !== this.data.position) {
this.set({
position: position
}).then(function () {
_this7.setWrapStyle();
});
}
}
}
});

8
dist/tabs/index.wxml vendored
View File

@ -1,7 +1,9 @@
<wxs src="../wxs/utils.wxs" module="utils" />
<view class="custom-class van-tabs van-tabs--{{ type }}">
<view style="z-index: {{ zIndex }}; {{ wrapStyle }}" class="van-tabs__wrap {{ scrollable ? 'van-tabs__wrap--scrollable' : '' }} {{ type === 'line' && border ? 'van-hairline--top-bottom' : '' }}">
<view class="custom-class {{ utils.bem('tabs', [type]) }}">
<view style="z-index: {{ zIndex }}; {{ wrapStyle }}" class="{{ utils.bem('tabs__wrap', { scrollable }) }} {{ type === 'line' && border ? 'van-hairline--top-bottom' : '' }}">
<slot name="nav-left" />
<scroll-view
scroll-x="{{ scrollable }}"
scroll-with-animation
@ -30,6 +32,8 @@
</view>
</view>
</scroll-view>
<slot name="nav-right" />
</view>
<view
class="van-tabs__content"

2
dist/tabs/index.wxss vendored
View File

@ -1 +1 @@
@import '../common/index.wxss';.van-tabs{position:relative;-webkit-tap-highlight-color:transparent}.van-tabs__wrap{position:absolute;top:0;right:0;left:0}.van-tabs__wrap--page-top{position:fixed}.van-tabs__wrap--content-bottom{top:auto;bottom:0}.van-tabs__wrap--scrollable .van-tab{-webkit-flex:0 0 22%;flex:0 0 22%}.van-tabs__scroll--card{border:1px solid #f44;border-radius:2px}.van-tabs__nav{position:relative;display:-webkit-flex;display:flex;background-color:#fff;-webkit-user-select:none;user-select:none}.van-tabs__nav--line{height:100%}.van-tabs__nav--card{height:30px}.van-tabs__nav--card .van-tab{line-height:30px;color:#f44;border-right:1px solid #f44}.van-tabs__nav--card .van-tab:last-child{border-right:none}.van-tabs__nav--card .van-tab.van-tab--active{color:#fff;background-color:#f44}.van-tabs__line{position:absolute;bottom:0;left:0;z-index:1;height:3px;background-color:#f44;border-radius:3px}.van-tabs--line{padding-top:44px}.van-tabs--line .van-tabs__wrap{height:44px}.van-tabs--card{padding-top:30px;margin:0 15px}.van-tabs--card .van-tabs__wrap{height:30px}.van-tabs__content{overflow:hidden}.van-tabs__track{position:relative}.van-tab{position:relative;min-width:0;padding:0 5px;font-size:14px;line-height:44px;color:#7d7e80;text-align:center;cursor:pointer;background-color:#fff;box-sizing:border-box;-webkit-flex:1;flex:1}.van-tab--active{font-weight:500;color:#333}.van-tab--disabled{color:#c9c9c9}.van-tab__title--dot::after{display:inline-block;width:8px;height:8px;vertical-align:middle;background-color:#f44;border-radius:100%;content:''}.van-tab__title__info{position:relative!important;top:-1px!important;display:inline-block;-webkit-transform:translateX(0)!important;transform:translateX(0)!important}
@import '../common/index.wxss';.van-tabs{position:relative;-webkit-tap-highlight-color:transparent}.van-tabs__wrap{position:absolute;top:0;right:0;left:0;display:-webkit-flex;display:flex;background-color:#fff}.van-tabs__wrap--page-top{position:fixed}.van-tabs__wrap--content-bottom{top:auto;bottom:0}.van-tabs__wrap--scrollable .van-tab{-webkit-flex:0 0 22%;flex:0 0 22%}.van-tabs__scroll--card{border:1px solid #f44;border-radius:2px}.van-tabs__nav{position:relative;display:-webkit-flex;display:flex;-webkit-user-select:none;user-select:none}.van-tabs__nav--line{height:100%}.van-tabs__nav--card{height:30px}.van-tabs__nav--card .van-tab{line-height:30px;color:#f44;border-right:1px solid #f44}.van-tabs__nav--card .van-tab:last-child{border-right:none}.van-tabs__nav--card .van-tab.van-tab--active{color:#fff;background-color:#f44}.van-tabs__line{position:absolute;bottom:0;left:0;z-index:1;height:3px;background-color:#f44;border-radius:3px}.van-tabs--line{padding-top:44px}.van-tabs--line .van-tabs__wrap{height:44px}.van-tabs--card{padding-top:30px;margin:0 15px}.van-tabs--card .van-tabs__wrap{height:30px}.van-tabs__content{overflow:hidden}.van-tabs__track{position:relative}.van-tab{position:relative;min-width:0;padding:0 5px;font-size:14px;line-height:44px;color:#7d7e80;text-align:center;cursor:pointer;background-color:#fff;box-sizing:border-box;-webkit-flex:1;flex:1}.van-tab--active{font-weight:500;color:#333}.van-tab--disabled{color:#c9c9c9}.van-tab__title--dot::after{display:inline-block;width:8px;height:8px;vertical-align:middle;background-color:#f44;border-radius:100%;content:''}.van-tab__title__info{position:relative!important;top:-1px!important;display:inline-block;-webkit-transform:translateX(0)!important;transform:translateX(0)!important}

9
dist/transition/index.js vendored
View File

@ -1,11 +1,6 @@
import { VantComponent } from '../common/component';
import { transition } from '../mixins/transition';
VantComponent({
mixins: [transition(true)],
props: {
name: {
type: String,
value: 'fade'
}
}
classes: ['enter-class', 'enter-active-class', 'enter-to-class', 'leave-class', 'leave-active-class', 'leave-to-class'],
mixins: [transition(true)]
});

6
dist/transition/index.wxml vendored
View File

@ -1,8 +1,8 @@
<view
wx:if="{{ inited }}"
class="van-transition custom-class"
style="-webkit-animation: van-{{ name }}-{{ type }} {{ duration }}ms both; animation: van-{{ name }}-{{ type }} {{ duration }}ms both; {{ display ? '' : 'display: none;' }} {{ customStyle }}"
bind:animationend="onAnimationEnd"
class="van-transition custom-class {{ classes }}"
style="-webkit-transition-duration:{{ currentDuration }}ms; transition-duration:{{ currentDuration }}ms; {{ display ? '' : 'display: none;' }} {{ customStyle }}"
bind:transitionend="onTransitionEnd"
>
<slot />
</view>

2
dist/transition/index.wxss vendored
View File

@ -1 +1 @@
@import '../common/index.wxss';.van-transition{-webkit-animation:ease both;animation:ease both}@-webkit-keyframes van-fade-enter{from{opacity:0}to{opacity:1}}@keyframes van-fade-enter{from{opacity:0}to{opacity:1}}@-webkit-keyframes van-fade-leave{from{opacity:1}to{opacity:0}}@keyframes van-fade-leave{from{opacity:1}to{opacity:0}}@-webkit-keyframes van-fade-up-enter{from{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes van-fade-up-enter{from{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@-webkit-keyframes van-fade-up-leave{to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes van-fade-up-leave{to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@-webkit-keyframes van-slide-up-enter{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes van-slide-up-enter{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@-webkit-keyframes van-slide-up-leave{to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes van-slide-up-leave{to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@-webkit-keyframes van-fade-down-enter{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes van-fade-down-enter{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@-webkit-keyframes van-fade-down-leave{to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes van-fade-down-leave{to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@-webkit-keyframes van-slide-down-enter{from{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes van-slide-down-enter{from{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@-webkit-keyframes van-slide-down-leave{to{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes van-slide-down-leave{to{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@-webkit-keyframes van-fade-left-enter{from{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes van-fade-left-enter{from{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@-webkit-keyframes van-fade-left-leave{to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes van-fade-left-leave{to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@-webkit-keyframes van-slide-left-enter{from{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes van-slide-left-enter{from{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@-webkit-keyframes van-slide-left-leave{to{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes van-slide-left-leave{to{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@-webkit-keyframes van-fade-right-enter{from{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes van-fade-right-enter{from{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@-webkit-keyframes van-fade-right-leave{to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes van-fade-right-leave{to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@-webkit-keyframes van-slide-right-enter{from{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes van-slide-right-enter{from{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@-webkit-keyframes van-slide-right-leave{to{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes van-slide-right-leave{to{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}
@import '../common/index.wxss';.van-transition{transition-timing-function:ease}.van-fade-enter-active,.van-fade-leave-active{transition-property:opacity}.van-fade-enter,.van-fade-leave-to{opacity:0}.van-fade-down-enter-active,.van-fade-down-leave-active,.van-fade-left-enter-active,.van-fade-left-leave-active,.van-fade-right-enter-active,.van-fade-right-leave-active,.van-fade-up-enter-active,.van-fade-up-leave-active{transition-property:opacity,-webkit-transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform}.van-fade-up-enter,.van-fade-up-leave-to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}.van-fade-down-enter,.van-fade-down-leave-to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}.van-fade-left-enter,.van-fade-left-leave-to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.van-fade-right-enter,.van-fade-right-leave-to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}.van-slide-down-enter-active,.van-slide-down-leave-active,.van-slide-left-enter-active,.van-slide-left-leave-active,.van-slide-right-enter-active,.van-slide-right-leave-active,.van-slide-up-enter-active,.van-slide-up-leave-active{transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}.van-slide-up-enter,.van-slide-up-leave-to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}.van-slide-down-enter,.van-slide-down-leave-to{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}.van-slide-left-enter,.van-slide-left-leave-to{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.van-slide-right-enter,.van-slide-right-leave-to{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}