`useAsyncQuery` return value null when press F5 refresh browser.

[toknT]

Environment

Nuxt project info: 11:57:42

---

• Operating System: Windows_NT
• Node Version: v20.12.2
• Nuxt Version: 3.12.4
• CLI Version: 3.12.0
• Nitro Version: 2.9.7
• Package Manager: npm@10.5.0
• Builder: -
• User Config: app, modules, apollo, elementPlus, runtimeConfig
• Runtime Modules: @element-plus/nuxt@1.0.9, nuxt-prepare@2.1.0, @nuxtjs/apollo@5.0.0-alpha.14
• Build Modules: -

Describe the bug

I am using nuxtjs+apollo creating admin panel .Using useLazyAsyncQuery to loading the table data.However if you press f5 refresh browser the table data will be empty.

// ============ findAll
const pageSize = 11;
const page = ref(1)
const tableData = ref<PaginatedSystemSetting>(emptyPaginatedSystemSetting)
const { data, status } = await useLazyAsyncData(async () => {
  await handleCurrentPageChange(1);
})
const handleCurrentPageChange = async (val: number) => {
  page.value = val;
  const loading = ElLoading.service({ fullscreen: true })
  const { data } = await useAsyncQuery<{ data: PaginatedSystemSetting }>(findAllQuery, {
    input: { page: page.value, perPage: pageSize }
  });
  console.debug('useAsyncQuery', data.value);
  if (data.value) {
    tableData.value = data.value.data
  }
  setTimeout(() => { loading.close(); }, 300);
}

Expected behaviour

UseLazyAsyncQuery be fired when navigation back in browser.

Reproduction

No response

Additional context

No response

Logs

No response

[toknT]

Finally I found if using f5 refresh page useQuery will fire onResult twice . So change code like this solve it.

const pageSize = 11;
const page = ref(1)
const tableData = ref<PaginatedSystemSetting>(emptyPaginatedSystemSetting)
const { data, status } = await useLazyAsyncData(async () => {
  await handleCurrentPageChange(1);
})
const handleCurrentPageChange = async (val: number) => {
  page.value = val;
  const loading = ElLoading.service({ fullscreen: true })
  useQuery<{ data: PaginatedSystemSetting }>(findAllQuery, {
    input: { page: page.value, perPage: pageSize },
  }, {
    fetchPolicy: 'network-only',
    prefetch: false,
  }).onResult((value) => {
    console.debug('onResult', value)
    if (value.loading == false) {
      tableData.value = value.data.data;
      setTimeout(() => { loading.close(); }, 300);
    }
  });
}