當(dāng)左右兩側(cè) 列固定fixed時(shí)鸠匀，總有這樣那樣兼容性問題
1.頭部滾動(dòng)條，很好解決 我們?cè)O(shè) .
ant-table-hide-scrollbar { &::-webkit-scrollbar {background:transparent !important; }}
這是表頭滾動(dòng)條的寬度還是存在的
2.表格寬度大于屏幕寬度時(shí)椿争，橫向有滾動(dòng)條怕膛，當(dāng)小于時(shí)，底部也有 一個(gè)不能滾動(dòng)的滾動(dòng)條秦踪。
查看dom結(jié)構(gòu)和css樣式發(fā)現(xiàn) 默認(rèn)的overflow為scroll褐捻。知道了原因就好解決了掸茅，
我們?cè)O(shè)為?.ant-table-body { overflow:auto !important; }
3.步驟2 會(huì)導(dǎo)致一個(gè)問題，當(dāng)表格只有一條數(shù)據(jù)柠逞，或tbody高度小于設(shè)置scrooll的Y值倦蚪，tbody 縱向是沒有滾動(dòng)條的，而表頭是有的边苹，就會(huì)出現(xiàn)內(nèi)容錯(cuò)開 對(duì)不齊的問題陵且。
4.有的同學(xué)會(huì)說，表頭也可以給他設(shè)寬度0 width:0 啊个束，這樣就會(huì)導(dǎo)致慕购，tbody數(shù)據(jù)大于 設(shè)置scrooll的Y值時(shí)，又會(huì)和表頭對(duì)不齊茬底。
解決辦法：
.ant-table-body { overflow:auto !important; }??
.ant-table-hide-scrollbar { &::-webkit-scrollbar { background:transparent !important; }}
.change-scrollBar { &::-webkit-scrollbar { width:0 !important; }}
我這邊是用JS去計(jì)算沪悲，當(dāng)前tbody的的scrollHeight是否小于?設(shè)置scrooll的Y值，來動(dòng)態(tài)的添加類(change-scrollBar)阱表，控制表頭滾動(dòng)條的寬度殿如。
當(dāng)前tbody的的scrollHeight是否小于?設(shè)置scrooll的Y值，表頭表體都沒有scroll的寬度最爬，就對(duì)齊咯
氣死我 上才藝
// table small時(shí) 表頭和表體滾動(dòng)條處理
export const checkScrollBar = () => {
????let antTableBody =document.querySelector('.ant-table-body')
????let antTableBodyScrollHeight = antTableBody && antTableBody.scrollHeight
? ? let antTableFixHeader =document.querySelector('.ant-table-hide-scrollbar')
????if (antTableBodyScrollHeight <470) {
????????antTableFixHeader && antTableFixHeader.classList.add('change-scrollBal')
? ? ?} else {
????????antTableFixHeader && antTableFixHeader.classList.remove('change-scrollBal')
????????}
????}
