How to use infinite scroll in quasar to load more datas?

[vltetea]

I am trying to load more data using quasar infinite scroll but i cannot load any more data infact it loads all the data once… and i got

done() is not a function

Below is my method for infinite scroll

initDefaultData (done, index) {
  setTimeout (() => {
    if (this.datas) {
      db.collection('example').orderBy('created_at', 'desc').get().then(res => {
        if (res.size < 1) {
          this.noData = true
        } else {
          res.forEach((doc) => {
            this.datas.push({
              id: doc.id
            })
          })
        }
      })
      done()
    }
  }, 1000)
}

Here is where i use infinite scroll in template

<q-infinite-scroll @load="initDefaultData">
  <q-card v-for="(data, index) in datas" :key="index" class="q-mb-md q-mt-sm">
  </q-card>
</q-infinite-scroll>

[dobbel]

@vltetea

You have to put the args in the @load

<q-infinite-scroll @load="initDefaultData(index,done)">
  <q-card v-for="(data, index) in datas" :key="index" class="q-mb-md q-mt-sm">
  </q-card>
</q-infinite-scroll>

Or with arrows:

<q-infinite-scroll @load="(index,done) => initDefaultData(index,done)">
  <q-card v-for="(data, index) in datas" :key="index" class="q-mb-md q-mt-sm">
  </q-card>
</q-infinite-scroll>

BTW: virtual scroll is better suited for infinite scrolling like q-virtual-scroll.