最近使用layui做前端,使用了table,由于需要添加定時器重新整理table,導緻頁面閃爍,令人生不如死。然後就拼命的百度找解決方法,終于找到了組織。
LAYUI用TABLE.RENDER加載資料 用TABLE.RELOAD重載裡面的資料---解決TABLE.RENDER重新加載閃動的問題
我這裡補充一下下載下傳位址: https://gitee.com/sun_zoro/layuiTablePlug
下面教你怎麼用
1:首先奉上下載下傳這個插件的位址
https://gitee.com/sun_zoro/layuiTablePlug
2:然後找到“下載下傳”檔案夾下把tablePlug檔案夾複制到你項目的合适位置
3:敲黑闆!!!把你項目一開始引入layui modules檔案夾下的table.js給替換了(或者你手動修改源碼),替換成你從git上下載下傳的那個table.js(這個可能後續不需要修改,現在賢心還沒整合!!!)
然後就是引入了
碼雲 readme.md有很清晰的說明,不過建議用下載下傳的layuiTablePlug\layui\src\lay\modules\table.js替換layui\modules檔案夾下的table.js。因為我改動源碼半天都不得行,年輕人要聽話。
最後需要注意layui的版本 本人2.6.5
layui.config({base:'static/tablePlug/'}).use(['table','tablePlug'], function(){
var table = layui.table;
var $ = layer.$;
var tablePlug=layui.tablePlug;
tablePlug.smartReload.enable(true);//處理不閃動的關鍵代碼
table.render({
elem: '#testone'
, method : 'POST'
,contentType: 'application/json'
,url:UrlSchool.oneWen() //既然要尊重原創,這裡就不改了
,id:"testoneTable" //id必須設定要不定時器對表格重載找不到id 我在說什麼啊
,smartReloadModel:true //處理不閃動的關鍵代碼
,cellMinWidth: 80 //全局定義正常單元格的最小寬度,layui 2.2.1 新增
,cols: [
[
{field:'deviceName', title:'裝置名稱', width:100}
,{field:'valveStatusName', title:'閥門狀态', width:120, edit: 'text'}
]
]
});
// var t1 = window.setInterval(hahahah,3000);
function hahahah(){
// 表格重載
table.reload('testoneTable',{
url:UrlSchool.oneWen()
});
}
});