欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

React+Antd修改Table組件滾動條樣式的操作代碼

 更新時間：2024年12月16日 10:16:03   作者：苦逼的猿寶  
這篇文章主要介紹了React+Antd修改Table組件滾動條樣式的操作代碼,本文給大家介紹的非常詳細,感興趣的朋友跟隨小編一起看看吧

版本 

Antd   @5.x.x

React @18.x.x

Tsx 

<Table
    dataSource={SocrePaMing.length > 0 ? SocrePaMing : []}
    columns={tableScoreColumns}
    rowKey="attribute"
    pagination={false}
    className="custom-table"
    scroll={{ y: 400 }} 
/>

Css 

.ant-table-body {
  scrollbar-width: auto;
  scrollbar-color: auto;
}
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.3);
  border-radius: 10px;
}
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.5);
}
::-webkit-scrollbar-thumb:window-inactive {
  background: rgb(219, 219, 219);
}

效果

到此這篇關(guān)于React+Antd修改Table組件滾動條樣式的文章就介紹到這了,更多相關(guān)react antd 滾動條樣式內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

  • React Hook 'useEffect' is called in function報錯解決

    React Hook 'useEffect' is call

    這篇文章主要為大家介紹了React Hook 'useEffect' is called in function報錯解決，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪
    2022-12-12
  • 在React中使用React.createRef：更優(yōu)雅的DOM引用方式

    在React中使用React.createRef：更優(yōu)雅的DOM引用方式

    React提供了多種方式來引用DOM元素,其中React.createRef()是一種更為現(xiàn)代、更優(yōu)雅的方式,在這篇文章中,我們將深入了解React.createRef()的應用,以及它為開發(fā)者帶來的便利,感興趣的朋友一起看看吧
    2024-01-01
  • 如何使用Redux Toolkit簡化Redux

    如何使用Redux Toolkit簡化Redux

    redux-toolkit是目前redux官方推薦的編寫redux邏輯的方法，針對redux的創(chuàng)建store繁瑣、樣板代碼太多、依賴外部庫等問題進行了優(yōu)化，官方總結(jié)了四個特點是簡易的/有想法的/強勁的/高效的，總結(jié)來看，就是更加的方便簡單了
    2022-12-12
  • React路由跳轉(zhuǎn)的實現(xiàn)示例

    React路由跳轉(zhuǎn)的實現(xiàn)示例

    在React中,可以使用多種方法進行路由跳轉(zhuǎn),本文主要介紹了React路由跳轉(zhuǎn)的實現(xiàn)示例,具有一定的參考價值,感興趣的可以了解一下
    2023-12-12
  • React18系列reconciler從0實現(xiàn)過程詳解

    React18系列reconciler從0實現(xiàn)過程詳解

    這篇文章主要介紹了React18系列reconciler從0實現(xiàn)過程詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪
    2023-01-01
  • react 跳轉(zhuǎn)后路由變了頁面沒刷新的解決方案

    react 跳轉(zhuǎn)后路由變了頁面沒刷新的解決方案

    最近在學習React的過程中遇到了路由跳轉(zhuǎn)后頁面不刷新的問題，本文就詳細的介紹一下解決方法，需要的朋友們下面隨著小編來一起學習學習吧
    2021-06-06
  • React聲明組件的方法總結(jié)

    React聲明組件的方法總結(jié)

    這篇文章主要給大家介紹了react聲明組件有哪幾種方法,各有什么不同,文章通過代碼示例介紹的非常詳細,對大家的學習或工作有一定的幫助,需要的朋友可以參考下
    2023-11-11
  • react hooks實現(xiàn)防抖節(jié)流的方法小結(jié)

    react hooks實現(xiàn)防抖節(jié)流的方法小結(jié)

    這篇文章主要介紹了react hooks實現(xiàn)防抖節(jié)流的幾種方法,文中通過代碼示例給大家講解的非常詳細,對大家的學習或工作有一定的幫助,需要的朋友可以參考下
    2024-04-04
  • React使用fullpage.js實現(xiàn)整屏翻頁功能

    React使用fullpage.js實現(xiàn)整屏翻頁功能

    最近筆者在完成一個移動端小項目的過程中需要實現(xiàn)整屏翻頁的效果；調(diào)研完畢之后,最終決定使用pullPage.js實現(xiàn)此功能,fullPage.js使用起來比較方便,并且官網(wǎng)上也給了在react項目中使用的demo,本文記錄了這個第三方庫的使用過程,感興趣的朋友可以參考下
    2023-11-11
  • React Fiber結(jié)構(gòu)的創(chuàng)建步驟

    React Fiber結(jié)構(gòu)的創(chuàng)建步驟

    這篇文章主要介紹了React Fiber結(jié)構(gòu)的創(chuàng)建步驟，幫助大家更好的理解和學習使用React，感興趣的朋友可以了解下
    2021-04-04

最新評論