Either not firing infiniteHandler or firing it forever

[climentjoan]

Hi there,

I'm trying to implement the infinite loadingm but I'm not able to do it. I've read the documentation and some similar issues, I tried also force-use-infinite-wrapper option without luck.

This is my code:

  <div
      style="overflow: auto"
      class=" columns is-multiline is-variable is-1 my-2"
      v-if="view == 0"
    >
      <div
        class="infinite column py-2 is-6-tablet is-12-mobile is-4-desktop is-3-fullhd"
        v-for="student in list"
        v-bind:key="student.id"
        style="overflow: auto"
      >
        <show-student-teacher
          :student="student"
          :classroom="classroom"
        ></show-student-teacher>
      </div>
      <infinite-loading
        ref="infiniteLoading"
        force-use-infinite-wrapper=".infinite"
        @infinite="infiniteHandler"
      >
      </infinite-loading>
</div>

If I load for example only 3 students, it works properly until it fills all the page, when I reach the bottom, the event doesn't fire. If I load 20 students, the event never fires as they fill all the page.

I tried moving the wrapper to the first div and in this case, infiniteHandler is called forever until there are no more students.

I'm using Bulma for CSS and both divs are flex. I've tried to add manually "overflow: auto" without luck.

Thanks

[climentjoan]

After a lot of trying, it seems that is working using my

as the wrapper has solved the issue.