etc/VueTube
0
0
Fork 0
mirror of https://github.com/VueTubeApp/VueTube synced 2024-11-25 20:55:17 +00:00
Code Issues Projects Releases Wiki Activity

fix: pagination issues on home page

Browse source
This commit is contained in:
Alex 2022-04-24 20:05:36 +12:00
parent 4f6fdddcad
commit b8e5fc0869
3 changed files with 13 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
NUXT/components/Comments/mainCommentRenderer.vue
View file

@ -21,7 +21,7 @@
v-if="getComponents()[Object.keys(comment)[0]]" v-if="getComponents()[Object.keys(comment)[0]]"
:is="Object.keys(comment)[0]" :is="Object.keys(comment)[0]"
:comment="comment[Object.keys(comment)[0]]" :comment="comment[Object.keys(comment)[0]]"
@intersect="paginate()" @intersect="paginate"
></component> ></component>
</v-list-item> </v-list-item>
<v-divider <v-divider

4
NUXT/components/observer.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<div class="observer" /> <div class="observer" style="height: 1px" />
</template> </template>
<script> <script>
@ -9,7 +9,7 @@ export default {
observer: null, observer: null,
}), }),
mounted() { mounted() {
const options = this.options || {}; const options = this.options || { threshold: 0.0 };
this.observer = new IntersectionObserver(([entry]) => { this.observer = new IntersectionObserver(([entry]) => {
if (entry && entry.isIntersecting) { if (entry && entry.isIntersecting) {
this.$emit("intersect"); this.$emit("intersect");

12
NUXT/pages/home.vue
View file

@ -11,8 +11,8 @@
<div v-for="(section, index) in recommends" :key="index"> <div v-for="(section, index) in recommends" :key="index">
<horizontal-list-renderer :render="section.contents[0]" /> <horizontal-list-renderer :render="section.contents[0]" />
</div> </div>
<vid-load-renderer v-if="!loading" :count="1" /> <vid-load-renderer v-if="loading" :count="1" />
<observer @intersect="paginate" /> <observer @intersect="paginate" v-else-if="recommends.length > 0" />
</div> </div>
</template> </template>
@ -40,8 +40,12 @@ export default {
methods: { methods: {
paginate() { paginate() {
if (this.recommends && !this.loading) {
this.loading = true; this.loading = true;
const continuationCode = this.recommends[
this.recommends.length - 1
].continuations.find((element) => element.nextContinuationData)
?.nextContinuationData.continuation;
if (continuationCode) {
this.$youtube this.$youtube
.recommendContinuation( .recommendContinuation(
this.recommends[this.recommends.length - 1].continuations.find( this.recommends[this.recommends.length - 1].continuations.find(
@ -53,6 +57,8 @@ export default {
this.loading = false; this.loading = false;
this.recommends.push(result); this.recommends.push(result);
}); });
} else {
this.loading = false;
} }
}, },
}, },