My page is using virtual scrolling, but it seems like the browser's native scrollbar is not being hidden.

[coderwx1]

Examples
Here's an example of my code,thx u
https://codesandbox.io/s/gracious-sea-2p8djp?file=/src/App.vue

[KingSora]

Good day @coderwx1

The problem here is that the RecycleScroller component is overwriting class names from the viewport element. Thus the correct stylings aren't applied.

You can just remove the part where you set the .scroller element as the viewport element and it should just work: https://codesandbox.io/s/headless-frog-43zm67?file=/src/App.vue

[coderwx1]

Good day @coderwx1

The problem here is that the RecycleScroller component is overwriting class names from the viewport element. Thus the correct stylings aren't applied.

You can just remove the part where you set the .scroller element as the viewport element and it should just work: https://codesandbox.io/s/headless-frog-43zm67?file=/src/App.vue

Thank you for your response. While this approach can indeed hide the native scrollbar. But，Due to the requirement of the virtual scrolling library, a size must be set for '.scroller'. However, after setting the size for '.scroller', the native scroll bar in the browser reappears. This is because the 'overflow-y: auto' CSS property for virtual scrolling overrides the OS CSS. Can you provide me some advice in this situation？ Thank you。

[KingSora]

@coderwx1 v2.2.0 just released which should make your initial example work as well. Here is your initial example just with overlayscrollbars v2.2.0: https://codesandbox.io/s/nervous-ardinghelli-fgxqbh?file=/src/App.vue

[coderwx1]

@coderwx1 v2.2.0 just released which should make your initial example work as well. Here is your initial example just with overlayscrollbars v2.2.0: https://codesandbox.io/s/nervous-ardinghelli-fgxqbh?file=/src/App.vue

Thank you. I have imported the latest released version and everything is working smoothly.