Vue infinite loader triggers @infinite method recursively

Question

Using Vue2 and Vuetify, I'm placing infinite-loader(from vue-infinite-loading library) component inside v-tab-item.

I want to make it work with the native browser scroll (body scroll). Similar to this demo

          <infinite-loading direction="bottom" @infinite="handleInfiniteLoader">
            <div slot="no-more"></div>
            <div slot="no-results"></div>
          </infinite-loading>

However, the handleInfiniteLoader method is triggered recursively on page load, until no more results are presented. The proper flow should be when the handleInfiniteLoader method is fired after I scroll down a bit.

    async handleInfiniteLoader($state: {
      loaded: () => any;
      complete: () => any;
    }) {
      let items = await this.load(); // returns array of items
      if (items.length > 0) {
        return $state.loaded();
      }
      return $state.complete();
    },

Any idea what can cause that?