Having some trouble using a reactive array in my component. It seems to work fine with an object, but when it comes to an array of objects, the view doesn't update as expected.
Any suggestions on how to ensure the view gets updated when the array is modified?
var self = currentClassInstance // this
self.store = {
resources: Vue.reactive([]),
test: Vue.reactive({ test: 'my super test' }),
setResources(resources) {
// The view isn't updating with this method. Any ideas why?
this.resources = resources
},
setResources(resources) {
// This one successfully updates the view
this.test.test = "test ok"
},
}
....
const app_draw = {
data() {
return {
resources: self.store.resources,
test: self.store.test,
}
},
updated() {
// It seems like the 'updated' event is triggered for "test" but not for "resources"
console.log('updated')
},
template: '<div v-for="(resource, key) in resources" :data-key="key">{{resource.name}}</div>'
};
....