This is a vue/vuex app and we have an object: myObject, that has a set of children: myObject.kids.
.kids is not loaded when the object is initially loaded by vuex.
Now I want to create a component that works on .kids.
What is the vue/vuex approach to this situation?
Should I create a root-level set to hold the kids or is there a way to load them (via ajax) into the myObject already in the store?
You can do whatever you want, load it vie ajax, create the property if it doesn't exist on component load, etc. The most important part is creating a reactive property, however. I would recommend the following:
this.$store.commit('SET_KIDS', payload)
Which would translate to a mutation in your store receiving a payload:
Vue.set(state.myObject, 'kids', payload)
This is important because the property needs to be reactive in order to be observable and for the store to record changes to the property.
