Add support useQuery Suspense

[teleskop150750]

Vue query suspense

<script setup>
import SuspendableComponent from './SuspendableComponent.vue'
</script>

<template>
  <Suspense>
    <template #default>
      <SuspendableComponent />
    </template>
    <template #fallback>
      <div>Loading...</div>
    </template>
  </Suspense>
</template>

<script>
import { defineComponent } from 'vue'
import { useQuery } from '@tanstack/vue-query'

const todoFetcher = async () =>
  await fetch('https://jsonplaceholder.cypress.io/todos').then((response) =>
    response.json(),
  )
export default defineComponent({
  name: 'SuspendableComponent',
  async setup() {
    const { data, suspense } = useQuery({
      key: () => ['todos'], 
      query: () => todoFetcher(),
    })
    await suspense()

    return { data }
  },
})
</script>

[posva]

In practice, it's better to not use Suspense (https://pinia-colada.esm.dev/nuxt.html#SSR) because it's unnecessary. You can however await refresh() (instead of await suspense())

[teleskop150750]

Thanks