vue混入page,触底加载，自动翻页

export default {
	data() {
		return {
			loading: true,
			page: {
				pageNo: 1,
				pageSize: 10,
				more: 'loadmore',
				filter: {},
				op: {},
				search: ''
			},
			filter: {}, // 额外的查询参数，避免与多级查询混淆
			total: 0,
			rows: []
		};
	},

	methods: {
		handleScroll() {
			console.log('执行了');
			// 获取当前滚动位置与页面总高度的差值
			const scrollHeight = this.$refs.container.scrollHeight;
			const scrollTop = this.$refs.container.scrollTop;
			const clientHeight = this.$refs.container.clientHeight;
			const diff = scrollHeight - scrollTop - clientHeight;

			// 判断是否已经滚动到底部
			if (diff <= 0) {
				console.log('已经滚动到底部了！');
				this.loading = true;
				this.getList();
			}
		},
		searchFilter({ filter, sort, op }) {
			if (filter) {
				this.page.filter = filter;
			}
			if (sort) {
				this.page.order = sort.order;
				this.page.sort = sort.sort;
			}
			if (op) {
				this.page.op = op;
			}
			this.getList(1);
		},
		getList(pageNo) {
			if (!this.action) return;
			if (pageNo == 1) {
				this.$axios.post(this.action, this.page).then((res) => {
					console.log(res);
					this.rows = res.data.rows;
					this.total = res.data.total;
					this.loading = false;
				});
			} else {
				this.page.pageNo += 1;
				this.$axios.post(this.action, this.page).then((res) => {
					console.log(res);
					this.rows = this.rows.concat(res.data.rows);
					this.loading = false;
				});
			}
		}
	}
};

使用这个混入的组件，需要设置scoll调用混入组件函数的自动翻页