...
|
...
|
@@ -40,7 +40,6 @@ |
|
|
|
|
|
<script>
|
|
|
import {BetterScroll} from 'cube-ui';
|
|
|
import lottie from 'lottie-web';
|
|
|
|
|
|
function getRect(el) {
|
|
|
if (el instanceof window.SVGElement) {
|
...
|
...
|
@@ -171,9 +170,7 @@ export default { |
|
|
mounted() {
|
|
|
setTimeout(() => {
|
|
|
this.initScroll();
|
|
|
setTimeout(() => {
|
|
|
this.pullDownInitTop = 0 - this.$refs.pulldown.clientHeight;
|
|
|
}, 0);
|
|
|
|
|
|
}, 20);
|
|
|
},
|
|
|
methods: {
|
...
|
...
|
@@ -257,21 +254,28 @@ export default { |
|
|
}
|
|
|
},
|
|
|
_initLottie() {
|
|
|
this.lottieBefore = lottie.loadAnimation({
|
|
|
container: document.getElementById('beforePullDown'), // the dom element that will contain the animation
|
|
|
renderer: 'svg',
|
|
|
loop: false,
|
|
|
autoplay: true,
|
|
|
path: 'https://cdn.yoho.cn/mapp/lottie/ufo-pull-1227.json' // the path to the animation json
|
|
|
});
|
|
|
this.lottieAfter = lottie.loadAnimation({
|
|
|
container: document.getElementById('afterPullDown'), // the dom element that will contain the animation
|
|
|
renderer: 'svg',
|
|
|
loop: true,
|
|
|
autoplay: true,
|
|
|
path: 'https://cdn.yoho.cn/mapp/lottie/ufo-refresh-1227.json' // the path to the animation json
|
|
|
});
|
|
|
|
|
|
setTimeout(() => {
|
|
|
import(/* webpackChunkName: "lottie-web" */ 'lottie-web').then(lottie => {
|
|
|
this.lottieBefore = lottie.loadAnimation({
|
|
|
container: document.getElementById('beforePullDown'), // the dom element that will contain the animation
|
|
|
renderer: 'svg',
|
|
|
loop: false,
|
|
|
autoplay: true,
|
|
|
path: 'https://cdn.yoho.cn/mapp/lottie/ufo-pull-1227.json' // the path to the animation json
|
|
|
});
|
|
|
this.lottieAfter = lottie.loadAnimation({
|
|
|
container: document.getElementById('afterPullDown'), // the dom element that will contain the animation
|
|
|
renderer: 'svg',
|
|
|
loop: true,
|
|
|
autoplay: true,
|
|
|
path: 'https://cdn.yoho.cn/mapp/lottie/ufo-refresh-1227.json' // the path to the animation json
|
|
|
});
|
|
|
this.$nextTick(() => {
|
|
|
this.pullDownInitTop = 0 - this.$refs.pulldown.clientHeight;
|
|
|
console.log(this.pullDownInitTop)
|
|
|
});
|
|
|
});
|
|
|
}, 200);
|
|
|
},
|
|
|
_initPullDownRefresh() {
|
|
|
this.scroll.on('pullingDown', () => {
|
...
|
...
|
@@ -280,6 +284,7 @@ export default { |
|
|
this.$emit('pullingDown');
|
|
|
});
|
|
|
this.scroll.on('scroll', (pos) => {
|
|
|
console.log('scroll')
|
|
|
if (!this.pullDownRefresh) {
|
|
|
return;
|
|
|
}
|
...
|
...
|
@@ -336,8 +341,11 @@ export default { |
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.list-wrapper {
|
|
|
position: relative;
|
|
|
height: 100%;
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
right: 0;
|
|
|
left: 0;
|
|
|
bottom: 0;
|
|
|
overflow: hidden;
|
|
|
background: #fff;
|
|
|
|
...
|
...
|
|