How to use in e.g. Pinia

[MidasLamb]

Hi, I'm pretty new to Vue3, and I'm wondering how I would need to go about invoking an API request using Villus in e.g. an action inside a Pinia Store?

It gives the following error:

Even though I useClient in the Store right before the call.

If you could help me out I'd love to open a PR to update the documentation with an example as well

[logaretm]

Do you mind creating an example for this? you can use codesandbox or stackblitz and I will be happy to take a look.

[fanckush]

I don't think this is because of Pinia specifically, related: https://github.com/logaretm/villus/issues/146 the error is correlated to the yellow warning above which has something to do with provide()ing / inject()ing

[logaretm]

@fanckush You are right, when it comes to provide/inject many things could go wrong which is why I wanted to see how exactly the OP is using Pinia with villus.

I may add an official example this weekend to try to answer this.

[GavinXue]

@logaretm Thank you for your great work of villus first, it's awesome. I have made this example here: https://codesandbox.io/s/mystifying-nobel-vy0r3x?file=/src/main.ts . Using useQuery outside of setup will encounter this, and in pinia I only can import the villusClient to execute query. though it works , I also really like to useQuery api to manage the queries. Hope there is some solutions or some ideas to use useQuery outside of setup()

[logaretm]

Thanks to @GavinXue in #156 this is much easier to do now in 1.1.0 that is If you plan to use useQuery and others in store actions.

However Pinia offers an official composable way to do this. An official example was added:

https://villus.logaretm.com/examples/state-store-pinia

[hipertracker]

Villus works with PInia for Vue 3, but I have a problem making it work with Vue 2 https://gist.github.com/hipertracker/3676ae8a5661f7d7423982188cc265fe

[logaretm]

@hipertracker Can you get that in a repo I can test?

[hipertracker]

@hipertracker Can you get that in a repo I can test?

I was wrong, Vue 2 also works https://gist.github.com/hipertracker/0682f2c88774cc5274c18f36db2e0a64