Support ref objects in `useQuery` (Types + Watch)

[warflash]

As mentioned in a previous issue, adding non primitive values to the query params doesn't quite work yet. https://github.com/wobsoriano/trpc-nuxt/issues/85#issuecomment-1875701180

It'd be great if we could pass in an object where all ref values in that object would be watched and their type wrapped in unref<> so that zod, or whatever input validation is used can properly deal with the types.

e.g.:

const currentPage = ref<number>(1);
const { data } = await $apiClient.getArticles.useQuery({
    language: "en",
    page: currentPage,
})

Here, page should be watched so the query executed again on change and the value passed to zod should not be a ref

Thank you!

[wobsoriano]

It might be a good enhancement, but I think it's kind of breaking Vue's composable convention. Check my comment here.