vue-query query return types are not unwraped in template?
Hello!
New to vue-query so unsure if this is a user error but the return type of
is not being unwraped correcly in the <template>.
vues typescript thinks I need to be calling {{ data.value}} but this is wrong and throws a runtime error, calling {{data}} in template throws a typescript error but run fine. Any ideas here?
16 Replies
solid-orange•2y ago
Which version are you using?
ratty-blushOP•2y ago
@M00LTi
solid-orange•2y ago
Can you do a typescript playground reproduction please
ratty-blushOP•2y ago
i dont think so cuz this is a vue issue on how it handles <template> with ref{} | ref<undefined>
i think it needs a ref<type | undefined>
molecular-blue•2y ago
Isn't this just because you're not checking data is not undefined?
{{ data?.name }}
ratty-blushOP•2y ago
No, autocompletes prompting me to do data.value.name and is not unwrapping the ref as it would any other ref.
{{ data?.name }} works perfectly but throws a type error. {{ data.value?.name }} throws no type error but throws a runtime error
molecular-blue•2y ago
Oh very strange. This seems like a Vue TS extension issue then. Since Vue query is just returning refs you should be able to replicate this bug without Vue query.
What version of the extension are you using and any other notable details you can think of
ratty-blushOP•2y ago
2.0.8
molecular-blue•2y ago
You could try messing around with these settings til you get it working
hybrid mode on or off or even trying typescript nightly
molecular-blue•2y ago
Failing that you should downgrade to the latest 1.x version and enable takeover mode
It's unfortunate but the transition from v1 to v2 of this extension has been a disaster
ratty-blushOP•2y ago
@Sandvich no luck on any of those...
Maybe im just doing something wrong here?
ratty-blushOP•2y ago
Wraping in a computed fixes this
ratty-blushOP•2y ago
Weirdly enough it wants me to .value even on the simple Ref like isSuccess which is Ref<false> | Ref<true>
Im starting to think there is just an issue with how vue-query is typed and its not inteded to be used directly in a template?
ratty-blushOP•2y ago
nvm this issue is showing up for useAsyncData also.... so probs a extension issue... will try fresh project and fresh vscode install.
ratty-blushOP•2y ago
would you look at that... working!
@Sandvich thank you for the help... will try to chase this down
vicious-gold•2y ago
in the future, please use #vue-query-questions for questions about vue-query ...