RFC: @urql/vue - Allow getter syntax in `useQuery`

[Neluji]

Summary

In Vue, if we use component props in the variable object of the useQuery composable, their reactivity is lost in the process and this results the same as if it was passed as a constant. To avoid this, the solution is to wrap the variable object in a toRef, using a getter function.

Allowing to pass directly the getter function to the variable property, as VueUse is doing with their MaybeRefOrGetter type, would be more fluent.

Proposed Solution

Check if the passed variable arg is a function, and if yes, unwrap it when needed (see VueUse useFetch composable and how they does it?)

[kitten]

Sorry, I forgot about this. Just to clarify, we don't use Vue ourselves regularly, so we're happy to receive PRs for it (same as for anything really — as long as it's not a heavy RFC that we may not accept, which isn't the case here of course)

Because we don't really have a lot of Vue projects to test against, I'm not 100% convinced that this works, and don't have enough context to test the getter-based reactive primitives in action. So I'd appreciate some feedback on whether it's working as intended ❤️

[Neluji]

Thanks ! But, well, I have to admit that not being used that much to npm packages dev I don't actually know how to test it ^^'\ How can I add the @urql/vue package to a project from the PR's branch of the monorepo ? 🥲

[kitten]

@Neluji I've just merged the PR, which means that the @urql/vue package with the PR's changes should be available now as a pre-release. That's published as @urql/vue@1.2.0-canary-9bf3289b, which you should be able to install and test using the @urql/vue@canary tag.

[Neluji]

Tested it in my project and it seems to work well! 👍🏻