layui表格刷新 但不重新渲染的方法 layui表格如何自动刷新

问题1:layui如何做到刷新表格 而不重新渲染

使用如下方法重新加载表格时会出现页面闪动,以及表格位置会重置的问题

deviceTable.reload()

目前有如下方法可以实现刷新的同时而不重新渲染页面
首先你需要结合layui表格插件和layui分页插件

let xxxTable= table.render({
	......
	page: {
		layout: ['prev', 'next', 'page', 'skip', 'count', 'limit', 'refresh']
	}
	......
});

使用上述代码会覆盖你的分页按钮,可自由调整按钮顺序,各参数含义如下
prev上一页按钮
next下一页按钮
page 1,2,3,4 页码按钮
skip输入页码跳转按钮
count总数据数量显示
limit每页显示数据限制选择
refresh刷新按钮(本文核心)

由于该刷新按钮只能在页码这一行,如果不满足你的需求,我们可以通过jQuery调用该按钮的点击事件从而达到不渲染刷新的效果,代码如下

$(".layui-icon-refresh").click();

可在该页面任意地方使用,举个栗子,自动刷新代码如下

let ref = null;
$("#toggleRefresh").click(function () {
	if (ref == null) {
		ref = setInterval(function () {
			$(".layui-icon-refresh").click();
		}, 2000);
	} else {
		clearInterval(ref);
		ref = null;
	}
});

上述代码绑定至一个按钮即可实现开关自动刷新功能

你可能感兴趣的:(layui)