【thymeleaf有趣的页面提示(设置的排序列与实际列数不一致，无法初始化表格样式)】

原创已于 2022-11-08 10:49:01 修改 · 354 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #javascript #ui #thymeleaf

于 2022-10-26 16:17:56 首次发布

thymeleaf 专栏收录该内容

2 篇文章

订阅专栏

博主分享使用thymeleaf前端框架的经历，页面初始化后提示问题，查看初始化table的js源码，发现设置的排序列与实际列数不一致，删除部分内容后问题解决。此外，博主认为thymeleaf组件不太友好，页面代码臃肿，期待后续组件化。

最近使用的thymeleaf前端框架，也是今天才自己动手写东西
遇到了很有意思的事情

数据列
怎么看都是九行九列，但是页面初始化完成后提示
在这里插入图片描述
可以看到页面已经全部加载完成了，而且页面按钮，功能都正常。
我看下了他们初始化table的js源码

function initDataTable(tableId,aoColumns,pageSize,action,json,searchForm,dom) {
	if(isEmpty(tableId)||isEmpty(aoColumns)){
		return;
	}
	//alert($('#'+tableId).find('tbody > tr').eq(0).find("td").size());
	var tr = $('#'+tableId).find('tbody > tr');
	if(!tr){
		return;
	}
	var td = tr.eq(0).find("td");
	if(!td){
		return;
	}
	var tdCount = td.size();
	
	if(tdCount<=1){
		return;
	}
	if(tdCount!=aoColumns.length){
		layer.alert("设置的排序列与实际列数不一致，无法初始化表格样式！");
		return;
	}

设置的排序列与实际列数不一致，无法初始化表格样式
这个时候我才仔细看了这个“排序列”，
源码中出现了aoColumns,因为页面都是从他页面复制的，我查找本页面

var aoColumns=[
				{ "bSortable": false },
				null,
				null, null,null,null,null,null,null,null,
				{ "bSortable": false }
			];

奶奶的删除两个啥事没有了。

最近使用thymeleaf组件不太友好，不知道后续会不会组件化，页面代码过于臃肿。