123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128 |
- 'use strict';
- Object.defineProperty(exports, '__esModule', { value: true });
- var utils_1 = require('../common/utils');
- var component_1 = require('../common/component');
- var validator_1 = require('../common/validator');
- var page_scroll_1 = require('../mixins/page-scroll');
- var ROOT_ELEMENT = '.van-sticky';
- component_1.VantComponent({
- props: {
- zIndex: {
- type: Number,
- value: 99,
- },
- offsetTop: {
- type: Number,
- value: 0,
- observer: 'onScroll',
- },
- disabled: {
- type: Boolean,
- observer: 'onScroll',
- },
- container: {
- type: null,
- observer: 'onScroll',
- },
- scrollTop: {
- type: null,
- observer: function (val) {
- this.onScroll({ scrollTop: val });
- },
- },
- },
- mixins: [
- page_scroll_1.pageScrollMixin(function (event) {
- if (this.data.scrollTop != null) {
- return;
- }
- this.onScroll(event);
- }),
- ],
- data: {
- height: 0,
- fixed: false,
- transform: 0,
- },
- mounted: function () {
- this.onScroll();
- },
- methods: {
- onScroll: function (_a) {
- var _this = this;
- var _b = _a === void 0 ? {} : _a,
- scrollTop = _b.scrollTop;
- var _c = this.data,
- container = _c.container,
- offsetTop = _c.offsetTop,
- disabled = _c.disabled;
- if (disabled) {
- this.setDataAfterDiff({
- fixed: false,
- transform: 0,
- });
- return;
- }
- this.scrollTop = scrollTop || this.scrollTop;
- if (typeof container === 'function') {
- Promise.all([
- utils_1.getRect(this, ROOT_ELEMENT),
- this.getContainerRect(),
- ]).then(function (_a) {
- var root = _a[0],
- container = _a[1];
- if (offsetTop + root.height > container.height + container.top) {
- _this.setDataAfterDiff({
- fixed: false,
- transform: container.height - root.height,
- });
- } else if (offsetTop >= root.top) {
- _this.setDataAfterDiff({
- fixed: true,
- height: root.height,
- transform: 0,
- });
- } else {
- _this.setDataAfterDiff({ fixed: false, transform: 0 });
- }
- });
- return;
- }
- utils_1.getRect(this, ROOT_ELEMENT).then(function (root) {
- if (!validator_1.isDef(root)) {
- return;
- }
- if (offsetTop >= root.top) {
- _this.setDataAfterDiff({ fixed: true, height: root.height });
- _this.transform = 0;
- } else {
- _this.setDataAfterDiff({ fixed: false });
- }
- });
- },
- setDataAfterDiff: function (data) {
- var _this = this;
- wx.nextTick(function () {
- var diff = Object.keys(data).reduce(function (prev, key) {
- if (data[key] !== _this.data[key]) {
- prev[key] = data[key];
- }
- return prev;
- }, {});
- if (Object.keys(diff).length > 0) {
- _this.setData(diff);
- }
- _this.$emit('scroll', {
- scrollTop: _this.scrollTop,
- isFixed: data.fixed || _this.data.fixed,
- });
- });
- },
- getContainerRect: function () {
- var nodesRef = this.data.container();
- return new Promise(function (resolve) {
- return nodesRef.boundingClientRect(resolve).exec();
- });
- },
- },
- });
|