[Vuejs]-Assigning Axios fetched data to Vuex State from Vuex Action

by

0👍

✅

In your actions, you are not provided with state but context.

So you need to do as follows:

actions: {
  fetchElementColors: function(context) {
      function getElementBlockColors() { return axios.get('/element-data/block.json'); }
      function getCategoryDataColors() { return axios.get('/element-data/type.json'); }

      axios.all([getElementBlockColors(), getCategoryDataColors()])
        .then(axios.spread(function(blockData, categoryData) {
          console.log(context.state);
          console.log(context.state.sample);
          context.state.myBlocks= blockData.data;
          context.state.myTypes= categoryData.data;
        }));
    }

}

Reference: https://vuex.vuejs.org/guide/actions.html

Leave a comment