手机网址全部出来,鄂州seo厂家,网站建设怎么做更好,标记位置的地图微信小程序开发教程使用element-ui 自带的InfiniteScroll 无限滚动组件无法使用在table里面#xff0c;所以项目只能组件写一个
俺的方法是写了一个自定义组件#xff0c;进行监听滚动条是否拉到最底部进行一个处理。方法如下
直接复制完事了#xff0c;
loadTableMore: { bind(el, binding…使用element-ui 自带的InfiniteScroll 无限滚动组件无法使用在table里面所以项目只能组件写一个
俺的方法是写了一个自定义组件进行监听滚动条是否拉到最底部进行一个处理。方法如下
直接复制完事了
loadTableMore: { bind(el, binding) { // 获取当前滚动的节点注意必须要有高度 const selectWrap el.querySelector(.el-table__body-wrapper) if (selectWrap) { selectWrap.addEventListener(scroll, function (e) { let sign 3 // 这个sign值只是为了滚动到最底部3px的时候加载 const scrollDistance this.scrollHeight - this.scrollTop - this.clientHeight if (Math.ceil(scrollDistance) sign) { // 到这里 就会执行方法了 binding.value() } }) } else { console.log(没找到元素) } },
}, 在table 绑定如下
因为我当时是写的html模板所以 v-load-table-more正常的vue模板 可以直接v-loadTableMore
el-table :datatableData :borderfalse :heighttableHeight v-load-table-moreinfiniteScrollLoad el-table-column fixed label排名 width50 propRowIndex aligncenter /el-table-column el-table-column fixed label排名 width50 propRowIndex aligncenter /el-table-column el-table-column fixed label排名 width50 propRowIndex aligncenter /el-table-column el-table-column fixed label排名 width50 propRowIndex aligncenter /el-table-column
/el-table 方法里面写上就可以监听到达底部的回调函数了
infiniteScrollLoad(){ }
