element-ui 的table无限加载更多 infinite-scroll

曹浩波
2023-12-01

// 此指令依赖于 element-ui

1 安装

npm install el-table-infinite-scroll -S

2 引入

全局引入

import Vue from 'vue';
import elTableInfiniteScroll from 'el-table-infinite-scroll';

Vue.use(elTableInfiniteScroll);

局部引入

import elTableInfiniteScroll from 'el-table-infinite-scroll';
export default {
  directives: {
    'el-table-infinite-scroll': elTableInfiniteScroll
  }
}

3 使用

<el-table :data="tableData" v-el-table-infinite-scroll="loadMoreData">
...
</el-table>
// js部分
export default {
	methods: {
		getData(){},
		loadMoreData() {
		   this.params.page++;
		   this.getData();
		}
	}
}
// 注意用该指令时不要使用 infinite-scroll-disabled 该参数,否则不会生效

== 以上 ==

 类似资料: