index.js
1.87 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
import { VantComponent } from '../common/component';
VantComponent({
props: {
zIndex: {
type: Number,
value: 99
},
offsetTop: {
type: Number,
value: 0
},
disabled: Boolean
},
data: {
wrapStyle: '',
containerStyle: ''
},
methods: {
setStyle() {
const { offsetTop, height, fixed, zIndex } = this.data;
if (fixed) {
this.setData({
wrapStyle: `top: ${offsetTop}px;`,
containerStyle: `height: ${height}px; z-index: ${zIndex};`
});
}
else {
this.setData({
wrapStyle: '',
containerStyle: ''
});
}
},
observerContentScroll() {
const { offsetTop } = this.data;
const intersectionObserver = this.createIntersectionObserver({
thresholds: [0, 1]
});
this.intersectionObserver = intersectionObserver;
intersectionObserver.relativeToViewport({ top: -offsetTop });
intersectionObserver.observe('.van-sticky', (res) => {
if (this.data.disabled) {
return;
}
// @ts-ignore
const { top, height } = res.boundingClientRect;
const fixed = top <= offsetTop;
this.$emit('scroll', {
scrollTop: top,
isFixed: fixed
});
this.setData({ fixed, height });
wx.nextTick(() => {
this.setStyle();
});
});
}
},
mounted() {
this.observerContentScroll();
},
destroyed() {
this.intersectionObserver.disconnect();
}
});