Simplebar: Scroll event doesn't work with vue js

[FuturFuturFutur]

I want to catch the scroll event on simplebar component. I use _v-on:scroll.native_ but it doesn't work, I can't understand why. What is the problem?
<simplebar v-on:scroll.native="infinityLoad" id="left_bar" class="col-lg-3 gauche" data-simplebar-auto-hide="false" ref="container"> .... </simplebar>

| Software | Version(s) |
| ---------------- | ---------- |
| SimpleBar | Latest
| Browser | Chrome 73.0.3683.1
| npm/Yarn | npm 6.4.1
| Operating System | Windows 10

[DivyanshBatham]

I also have to implement infinite scroll, have been trying for hours now. I'm working in Vue with (simplebar-vue wrapper). I would really appreciate if anyone can guide me in the right direction.

[DivyanshBatham]

@FuturFuturFutur I just solved it somehow :sweat_smile:

Sharing what I have done, hopefully it might help you out:

      <simplebar
        class="table-container"
        data-simplebar-auto-hide="false"
        ref="scroll"
      >
        <Table />
      </simplebar>

Attaching the eventListener using refs:

     this.$refs.scroll.scrollElement.addEventListener(
        "scroll",
        this.handleScroll
      );

Note, you might be wondering what's that scrollElement. Well I looked inside the code of simplebar-vue and learnt that they are setting a ref. So, I thought I can access it and set my own listener to it.

Since I wanted to implement infinite scroll my handleScroll looks like this:

    handleScroll(event) {
      let { scrollTop, scrollHeight, clientHeight } = event.target;
      const offsetForTrigger = 450;

      if (scrollHeight - clientHeight - offsetForTrigger < scrollTop)
        console.log("Fetch More Data");
    },

[Grsmto]

Thanks @DivyanshBatham !
Could you tell me what would be the best way to implement this to simplify this process with the Vue plugin?
Also your solution seems fine to me, but I'm seeing this is undocumented, maybe solution would be to just document this properly?

Thanks

[yifeidai]

Why don't you emit a scroll event when the srollElement is scrolling?
Bind all the event to the scroll element is also a good idea. Vue has the following api to realize it.

v-on="$listeners"

I think the scroll event is necessary for many people.