79432486

Date: 2025-02-12 09:17:59
Score: 0.5
Natty:
Report link

I think what you want is implemented in Dynamic loading options as described in docs.

You can add @virtual-scroll event and you can trigger fetchData in it's handler.

Example from docs:

// Template

<q-select
  filled
  v-model="model"
  multiple
  :options="options"
  :loading="loading"
  @virtual-scroll="onScroll"
/>

// Script

setup () {
const loading = ref(false)
const nextPage = ref(2)
const options = computed(() => allOptions.slice(0, pageSize * 
 (nextPage.value - 1)))

return {
  model: ref(null),
  loading,

  nextPage,
  options,

  onScroll ({ to, ref }) {
    const lastIndex = options.value.length - 1

    if (loading.value !== true && nextPage.value < lastPage && to === 
      lastIndex) {
      loading.value = true

      setTimeout(() => {
        nextPage.value++
        nextTick(() => {
          ref.refresh()
          loading.value = false
        })
      }, 500)
    }
  }
 }
Reasons:
  • Long answer (-0.5):
  • Has code block (-0.5):
  • User mentioned (1): @virtual-scroll
  • Low reputation (0.5):
Posted by: Bakhtiyor Sulaymonov