關(guān)于Element?table組件滾動(dòng)條不顯示的踩坑記錄
更新時(shí)間：2022年08月27日 10:42:32 作者：達(dá)希_
這篇文章主要介紹了關(guān)于Element?table組件滾動(dòng)條不顯示的踩坑記錄，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
踩坑詳情
在多table切換的單個(gè)頁面內(nèi)
1、某些table的橫向滾動(dòng)條不自動(dòng)顯示，在手動(dòng)調(diào)整窗體大小或者進(jìn)行縮放操作時(shí)會(huì)恢復(fù)正常。
如：
2、某些table的橫向滾動(dòng)條顯示在表格的中部位置，在在手動(dòng)調(diào)整窗體大小或者進(jìn)行縮放操作以及表格中數(shù)據(jù)條目增加到滾動(dòng)條位置時(shí)會(huì)恢復(fù)正常。
如：
處理辦法
看了一下github上有很多類似的issue，但貌似沒有得到官方解決。
所以暫且認(rèn)為是個(gè)Bug。
- 情況1：
- 經(jīng)過簡(jiǎn)單測(cè)試，發(fā)現(xiàn)滾動(dòng)條向上偏移的距離和表格的列數(shù)有關(guān)，列數(shù)減少到12列左右就可恢復(fù)正常。（P.S. 有很大的可能是列的總寬度和頁面大小存在一定關(guān)系，這里說的12列是我所測(cè)試的特定環(huán)境下的合適值，由于時(shí)間原因沒有深入研究，所以僅供參考）
- 情況2：
- 也是簡(jiǎn)單測(cè)試，發(fā)現(xiàn)如果存在標(biāo)題較長(zhǎng)的列，發(fā)生了換行，如上所示的“標(biāo)題很長(zhǎng)很長(zhǎng)很長(zhǎng)的測(cè)試列”，就會(huì)出現(xiàn)前文所述的現(xiàn)象，處理方法是，增加該列的寬度，使其不需要換行，即可恢復(fù)正常。
因?yàn)闇y(cè)試簡(jiǎn)單，也沒有研究源碼，所以得出的結(jié)論簡(jiǎn)單且武斷。
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Vue-Router路由是根據(jù)不同的url地址展現(xiàn)不同的內(nèi)容或頁面,這篇文章主要給大家介紹了關(guān)于Vue3中如何使用Vue?Router的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-02-02
elementUI樣式修改未生效問題詳解(掛載到了body標(biāo)簽上)
vue+elementUI項(xiàng)目開發(fā)中,經(jīng)常遇到修改elementUI組件樣式無效的問題,這篇文章主要給大家介紹了關(guān)于elementUI樣式修改未生效問題的相關(guān)資料,掛載到了body標(biāo)簽上,需要的朋友可以參考下2023-04-04
Vue?warn:Property?"state"?was?accessed?during
這篇文章主要為大家介紹了Vue?warn:Property?"state"?was?accessed?during?render的報(bào)錯(cuò)解決，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-06-06
vue修改vue項(xiàng)目運(yùn)行端口號(hào)的方法
本篇文章主要介紹了vue修改vue項(xiàng)目運(yùn)行端口號(hào)的方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-08-08
Vue2實(shí)時(shí)監(jiān)聽表單變化的示例講解
今天小編就為大家分享一篇Vue2實(shí)時(shí)監(jiān)聽表單變化的示例講解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-08-08
vue3?keep-alive實(shí)現(xiàn)tab頁面緩存功能
如何在我們切換tab標(biāo)簽的時(shí)候，緩存標(biāo)簽最后操作的內(nèi)容，簡(jiǎn)單來說就是每個(gè)標(biāo)簽頁中設(shè)置的比如搜索條件及結(jié)果、分頁、新增、編輯等數(shù)據(jù)在切換回來的時(shí)候還能保持原樣，這篇文章介紹vue3?keep-alive實(shí)現(xiàn)tab頁面緩存功能，感興趣的朋友一起看看吧2023-04-04
vue 點(diǎn)擊展開顯示更多(點(diǎn)擊收起部分隱藏)
這篇文章主要介紹了vue 點(diǎn)擊展開顯示更多(點(diǎn)擊收起部分隱藏)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
vue如何動(dòng)態(tài)設(shè)置class、動(dòng)態(tài)設(shè)置style
這篇文章主要介紹了vue如何動(dòng)態(tài)設(shè)置class、動(dòng)態(tài)設(shè)置style，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
Vue3中ref和reactive的基本使用及區(qū)別詳析
這篇文章主要給大家介紹了關(guān)于Vue3中ref和reactive的基本使用及區(qū)別的相關(guān)資料,需要的朋友可以參考下2022-07-07
Vue動(dòng)畫事件詳解及過渡動(dòng)畫實(shí)例
通過 Vue.js 的過渡系統(tǒng)，可以在元素從 DOM 中插入或移除時(shí)自動(dòng)應(yīng)用過渡效果。Vue.js 會(huì)在適當(dāng)?shù)臅r(shí)機(jī)為你觸發(fā) CSS 過渡或動(dòng)畫，你也可以提供相應(yīng)的 JavaScript 鉤子函數(shù)在過渡過程中執(zhí)行自定義的 DOM 操作2019-02-02