[Vuejs]-How to define an empty Vuex state and then check it is not empty/null in Vue component?

by

1👍

This is a classic case to use computed: 

computed: {
   product() {
     return this.Product || [];
   }
}

1👍

In the store function when you do the request you can check
examoe

const actions = {
     loadProduct({commit}, {ProudctID}) {
if (this.product.length > 0) {// <-- new code
  return this.product // <-- new code
} else { // <-- new code
     // do the http request
     axios.get(`/api/${ProductID}`)
    .then(response => {
    commit('setProduct', response.data)}
    )
     .catch(function (error) {
     //error handler here
     }
   }// <-- new code
   }
};

Leave a comment