Infinite Scroll ON TABS

Questions
1

How i can create infinite scroll ON TABS

    <f7-toolbar tabbar>
      <f7-link tab-link="#tab-1" tab-link-active>All</f7-link>
      <f7-link tab-link="#tab-2">Payed</f7-link>
    </f7-toolbar>
    <f7-tabs>
      <f7-tab id="tab-1" class="page-content infinite-scroll-content" tab-active infinite :infinite-preloader="showPreloader" :infinite-distance="50" @infinite="loadMore">

      </f7-tab>
      <f7-tab id="tab-2" class="page-content infinite-scroll-content" infinite :infinite-preloader="showPreloader" :infinite-distance="50" @infinite="loadMore">

      </f7-tab>
    </f7-tabs>

Above is the sample code. The callback function is not executed. I don’t know what to do.

2

f7-tab doesn’t have infinite and all related props http://framework7.io/vue/tabs.html#tabs-properties. So it should be done similar to this:

<f7-tab id="tab-1" class="page-content infinite-scroll-content" @infinite.native="loadMore">
  ...
  <div class="preloader" v-if="showPreloader"></div>
</f7-tab>
2 Likes
3

how about in react? i can find solution for react, please help :frowning:

1 Like