I'm trying to use Pinia with vue 2 and composition api.
I followed the docs to install pinia@next, used it with Vue.use(PiniaPlugin) and in the app used Vue({ ..., pinia: createPinia() })
When i create a store copy-pasting from docs
export const useStore = defineStore('main', {
state: () => ({
counter: 1,
}),
getters: {
doubleCount: (state) => state.counter * 2,
},
})
and in a component, do
<template>
<p>Double count is {{ store.doubleCount }}</p>
<p>Counter is {{ store.counter }}</p>
</template>
<script>
export default {
setup() {
const store = useStore()
return { store }
},
}
</script>
Why is my getter doubleCount always undefined (when inspecting from setup(), or trying to use in template?
store.counter shows the correct value.
I'm new to both Vue and Pinia, so I must be doing something wrong here.