You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
After some debugging, I guess that the problem may came from initWatch when collect dependencies. When excute get function to add dep, pinia will travers the state object, which cause wrong dependency relation.
The text was updated successfully, but these errors were encountered:
Have you tried this in Vue 3? It could be a bug with effectScope and Vue 2.
As a workaround, you can use mapStores() instead and watch the store or you can ensure the store is instantiated before this.foo is called. This can be achieved by using mapStores() and reading any property from the store before creating the watcher:
exportdefault{name: 'App',data: ()=>({color: '#f00',swatches: ['#f00','#ccff00','#eee','#0f0'],}),computed: {
...mapState(useStore,['lol','bar']),
...mapStores(useStore),},methods: {
...mapActions(useStore,['setBar']),},created(){this.fooStore.$state// store is instantiatedthis.$watch('lol',()=>{console.log('lol changed')},{deep: true})this.setBar()},}
Reproduction
https://github.com/reuwi/pinia-vue2-watch-bug-repro/tree/master
Steps to reproduce the bug
Step1: Clone this repo to local
Step2: install dependencies
Step3: open http://localhost:8081/ in browser
Expected behavior
No alert is promoted
Actual behavior
Got an promoted alert with 'lol changed'
Additional information
After some debugging, I guess that the problem may came from initWatch when collect dependencies. When excute get function to add dep, pinia will travers the state object, which cause wrong dependency relation.
The text was updated successfully, but these errors were encountered: