Vue waterfall stream plug-in vue-waterfall-easy scrollLoadImg does not work, the drop-down scroll bar does not load pictures?

<template>
    <div id="all_user">
        <div class="search_box">
            <input type="text" placeholder="">
            <button><i class="tt tt-quanburen"></i></button>
        </div>

        <vue-waterfall-easy :imgsArr="imgsArr" @scrollLoadImg="fetchImgsData">
        </vue-waterfall-easy>
    </div>
</template>

<script>
    import vueWaterfallEasy from "vue-waterfall-easy"

    export default {
        components: {
            vueWaterfallEasy
        },
        data() {
            return {
                imgsArr: [],
                fetchImgsArr: []
            }
        },
        methods: {
            // 
            initImgsArr(n, m) { //num 
                let arr = [];
                for (let i = n; i < m; iPP) {
                    arr.push({
                        id: i,
                        src: `../../../static/images/${i + 1}.jpg`,
                        link: "",
                        info: ""
                    })
                }
                return arr
            },

            fetchImgsData() {
                console.log("")
                this.imgsArr = this.imgsArr.concat(this.fetchImgsArr)
            },
        },
        created() {
            this.imgsArr = this.initImgsArr(0, 5);
            this.fetchImgsArr = this.initImgsArr(5,9) // 
            console.log(1,this.imgsArr,2,this.fetchImgsArr)
        },

    }

</script>
May.27,2021

look at the scrolling event written by the source code
clipboard.png


huh? Has the landlord solved it? I also encountered the same problem. I don't know if the height setting of the page caused the positioning problem of the control.

Menu