From 7ebf4a646ebe39c55e85e6ecf68c5e05ddd53bfc Mon Sep 17 00:00:00 2001 From: javiertury Date: Thu, 11 Oct 2018 00:26:51 +0200 Subject: [PATCH] Warn about vuex module reuse Vuex modules must be constructed in a special way to avoid the stateful singleton problem. Warn about it. --- docs/guide/structure.md | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/docs/guide/structure.md b/docs/guide/structure.md index 499b0b14..ade77d53 100644 --- a/docs/guide/structure.md +++ b/docs/guide/structure.md @@ -121,3 +121,25 @@ export default context => { return app } ``` + +## Vuex module reuse + +[Multiple vuex module instances](https://vuex.vuejs.org/guide/modules.html#module-reuse) can share references to the same underlying state objects. The state at each render will be polluted with references to the state at previous renders. We can prevent this undesired behaviour. Instead of assigning a simple object to the `state` module property, we must assign a function that returns a new state object each time that it is invoked. + +``` js +const module = { + state () { + return { + foo: 'bar' + } + }, + mutations: { + incrementFoo (state) { + ... + }, + } + // actions, getters... +} +``` + +vuex module reuse