<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>