[Vuejs]-Vue: Do computed properties watch for internal data changes?

by

0👍

✅

It feels like there might be a better approach, since this looks quite complex. But perhaps the reactivity is not working because the data is only set on mount. You could set a watcher on your property and bind the new property data to productsData on a change.

But, I have the feeling that it might be a better approach to create an addProduct methods that will push a product into you data array. Something like this.

watcher: {
    products(value) {
        value.data.forEach(this.addProduct);
    }
},
methods: {
    addProduct(product) {
       // here you could also check if the product already exists in your 
       // productsData
       this.productsData.unshift(product);
    },
    fetchProducts() {
        this.$http.get('/api/products')
                  .then(resp => {
                      // Now we can loop through and add the products.
                      resp.data.forEach(this.addProduct);
                  });
    }
}

I hope this helps.

Leave a comment