自我介紹
我，以前一直是一名90%時間都在寫java的後端開發人員，自從來到現在的公司後，被迫營業，寫起了前端代碼，就問你們，苦不苦逼
簡單介紹一下項目
項目採用前後端分離開發，前端採用的是VUE，UI框架使用的layui（吐槽一下，雖然我很喜歡layui的樣式，但是它和VUE目前確實沒辦法兼容得很好，還是elemen-ui好用一些），後端採用的是SSM（OMG，其實都不能算是M，因爲用的是ibatis）
接手任務
有一天，老大讓開發的一個模塊需要使用複雜表頭，類似於下面這種
查閱layui的文檔，發現layui支持複雜表頭創建，於是乎，直接按照文檔進行代碼編寫。
開發
啪啪啪啪...，Ctrl C and Ctrl V，一個星期後，模塊寫好了，測試使用的死數據（因爲當時沒有對接後端），能夠達到預期效果，看起來一切都是那麼正常，沒有什麼問題，檢查一番後，直接commit
任務看似完美完成，但是，不料，一個月後......
一個月時間，轉眼即逝，後端接口已完成，所以需要對接接口，然後再進行測試（是的，我們公司沒有測試，測試的工作還得自己做）。
對接接口、填充數據、表格渲染，一氣呵成。
測試
剛開始還是一切正常，可是後來，多次獲取不同的數據進行渲染時，出現了問題，有時候會多渲染出一列，具體如下圖
最開始，我真的沒有懷疑是框架渲染的問題，只是以爲自己渲染數據給錯了，然後我花了7 8個小時檢查自己的數據（因爲數據是動態生成的，所以比較複雜），又是debug，又是console.log，什麼方式都試過了，還是沒找出數據的問題，最後才思考，是不是框架的問題。
百度一下，我瞬間淚目，果然是框架自身的原因，不知道是bug，還是有意爲之，直到我現在的版本layui-v2.5.6，依舊是這樣的，所以，各位有長時間解決不了的問題，不妨先問問搜索引擎。
網上查找資料，當複雜表頭，子表頭只有一列的時候，它會當作普通表頭渲染，所以就會多出一列。
解決辦法
那麼如何解決呢？
網上的方法也不止一種，有改源碼的，有利用CSS進行隱藏的。
我這種菜鳥水平，改源碼是不可能改源碼的，那麼，只能從隱藏入手了。只要我能把你隱藏起來，就可以當你不存在。
首先，打開F12，查看這一列元素有何特徵
可以看出，這個多出來的一列，他的data-field是數字，那麼，我們就可以利用這個特徵來處理它
找到官網的文檔，可以看到，有一個done的回調函數，當數據渲染完成之後回調，那麼，我們可以在數據渲染完成之後，對這一列進行隱藏
具體代碼
done: function(res, curr, count) {
// 直接刪選出data-field='6'隱藏
// $("td[data-field='6']").hide()
// 或者循環遍歷data-field>0的隱藏
$.each($("td"), (function() {
if($(this).attr('data-field') > 0){
$(this).hide()
}
}))
}
這樣操作後，表格就正常了
如果大家覺得有幫助，就請點個贊吧