Can I send from getters in Vuex

Question

Fiddle: here

I am creating a webapp with Vue 2 with Vuex. I have a repository where I want to get status data from getter. What I want is if getter detects that the data is not yet full, it causes the data to be sent and fetched.

Below is my Vuex store:

const state = {
  pets: []
};

const mutations = {
  SET_PETS (state, response) {
    state.pets = response;
  }
};

const actions = {
 FETCH_PETS: (state) => {
      setTimeout(function() { 
            state.commit('SET_PETS', ['t7m12qbvb/apple_9', '6pat9znxz/1448127928_kiwi'])
    }, 1000)
 }
}

const getters = {
    pets(state){
    if(!state.pets.length){
        state.dispatch("FETCH_PETS")
    }
    return state.pets
  }
}

const store = new Vuex.Store({
  state,
  mutations,
  actions,
  getters
});

But I get the following error:

Uncaught TypeError: state.dispatch is not a function (...)

I know that I can do this from beforeMountthe Vue component, but I have several components that use the same Vuex repository, so I have to do this in one of the components, which should be and how it will affect the other components.

Answer 1

Getters , state not context

, , , .

Getters " ".

pets , , FETCH_PETS getter