VueJs - Как узнать, когда полоса прокрутки DIV достигла своего дна - PullRequest
0 голосов
/ 28 мая 2020

Я новичок в Vuejs. Как я могу получить сообщение, когда div в Datatable vuejs достигает нижней части своей страницы. Будет очень полезно, когда мне кто-нибудь поможет.

screenshot screenshot

1 Ответ

0 голосов
/ 13 июня 2020

Я отправляю ответ на этот вопрос, который я понял правильно. На самом деле у меня есть идеи от чьего-то комментария в этом вопросе, которого я сейчас не вижу. Добавление кода:

 mounted() {            
            let box = document.querySelector(".v-data-table__wrapper");
            // @ts-ignore
            box.addEventListener("scroll", this.scrollHandler);
        }
 /*
            * Infinite scroll event
        */
        scrollHandler(e) {
            // @ts-ignore
            let context = this.$store.state[this.$options.parent.fileName];

            if (!context.lazyLoading.enabled) {
                return;
            }

            let el = e.srcElement;
            // @ts-ignore
            this.reachedBottom = false;

            // @ts-ignore
            let context = this.$store.state[this.$options.parent.fileName];

            // @ts-ignore
            if (!this.reachedBottom) {
                if (el.scrollTop >= (el.scrollHeight - el.clientHeight) - 100) {
                    // @ts-ignore
                    this.reachedBottom = true;

                    if (context.lazyLoading.enabled && context.lazyRecords && context.lazyRecords.length > 0)
                        context.formData = context.lazyRecords.slice(0, (context.formData.length + (context.lazyLoading.initialRecordLoad || context.dashboard.lazyLoading.initialRecordLoad)));
                    else if (!context.lazyLoading.enabled)
                        context.formData = context.copyData.slice(0, (context.formData.length + (context.lazyLoading.initialRecordLoad || context.dashboard.lazyLoading.initialRecordLoad)));
                }
            }

            this.$nextTick(() => {
                // @ts-ignore
                this.reachedBottom = false;
            });
        }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...