Мутация Vuex не обновляет состояние при загрузке - PullRequest
0 голосов
/ 05 марта 2019

Итак, я фиксирую мутацию при загрузке страницы, но она не обновляет состояние, но если я фиксирую ту же мутацию на странице, она работает нормально.Есть ли что-то, чего мне не хватает, когда дело доходит до состояния, не готового к обновлению после загрузки страницы?

main.js:

  new Vue({
     router,
     store,
     jQuery,
     el: '#app',
     mounted() {
        store.dispatch('getImages');
     },
     render: h => h(App)
   });

Store.js

const state = {
    images: []
    };

    const getters = {
    getImages: (state) => {
        return state.images;
    }
    };

    const mutations = {
     getImages: (state, payload) => {
        let that = this;
        $client.getSpace(process.env.VUE_APP_CONTENTFUL_SPACE_ID)
            .then((Environment) => {
                Environment.getAssets()
                    .then((assets) => {
                        let images = [];
                        assets.items.forEach(function (item) {
                            if (!item.fields.title['en-US'].includes('About')) {
                                images.push(item.fields.file['en-US'].url);
                            }
                        });
                        Vue.set(state, 'images', images);

                        localStorage.images = JSON.stringify(images);
                    });
            });
     },
    };

    const actions = {
    getImages({ commit }) {
        setTimeout(function () {
            commit('getImages')
        }, 500)
    }
};

    export default new Vuex.Store({
     state,
     mutations,
     getters,
     actions
    })

1 Ответ

0 голосов
/ 05 марта 2019

Вам нужно передать свой магазин экземпляру приложения.

import store from './store' // correct path to your store

new Vue({
  router,
  store,  <---
  // ...
})

Я не понимаю, почему вы оборачиваете свое приложение Vue в setTimeout.

Я предлагаю вам прочитать Vuexдокументация.Вы выполняете асинхронную работу в мутации, где этот тип вещи относится к действию .

...