自己独立发布一个插件实现滚动加载使用
Vue.directive('loadmore', {
bind (el, binding) {
// 获取element-ui定义好的scroll盒子
const SELECTWRAP_DOM = el.querySelector('.el-select-dropdown .el-select-dropdown__wrap')
SELECTWRAP_DOM.addEventListener('scroll', function () {
const CONDITION = this.scrollHeight - this.scrollTop <= this.clientHeight
if (CONDITION) {
binding.value()
}
})
}
})
v-loadmore="loadMore"
一个方法:loadmore
// 下拉加载
loadmore() {
this.formData.pageIndex++;
this.getUsers(this.formData);
},
getUsers(v) {
let num = ~~this.formData.pageIndex * ~~this.formData.pageSize;
this.userItems = this.users.filter((item, index, arr) => {
return index < num;
});
},
网友评论