Получить состояние магазина vuex после отправки действия - PullRequest
1 голос
/ 16 марта 2020

Я создаю приложение чата в Laravel 6 + Vue + Vuex . Я хочу позвонить в vuex store и получить состояние после завершения действий по отправке, а затем я хочу выполнить некоторую обработку этого состояния в моем vue компоненте.

In ChatWindow компонент

mounted: function () {
    this.$store.dispatch('setContacts').then(() => {
        console.log('dispatch called')
        // I want to call the getter here and set one of the data property
    });
}

действие. js

setContacts: (context) => {
    axios.post('/users').then(response => {
        let users = response.data;
        // consoled for testing
        console.log(users);
        context.commit('setContacts', users);
    });
}

мутаторы. js

setContacts: (state, users) => {
    state.contacts = users;
},

Пожалуйста, смотрите скриншот ниже. , затем метод отправки работает до setContacts в действии. js.

image of console.logs

Мне нужно вызвать getter после завершения действия dispatch . (который будет эффективно устанавливать состояние контактов). Затем я хочу получить контакты через getContacts геттер вот так.

геттеры. js

getContacts: (state) => {
    return state.contacts;
}

Я также попытался позвонить вычисленное свойство в затем в смонтировано , и оно не сработало. Кроме того, не следует ли «отправлять вызов» при подключенном запуске после console.log setContacts в действии . js в том виде, как в этом методе? Спасибо!

1 Ответ

3 голосов
/ 16 марта 2020

Может быть, вы могли бы обернуть топором ios вызов внутри другого обещания.

return new Promise((resolve, reject) => {

   axios.post('/users')
     .then(response => {
        let users = response.data;
        // consoled for testing
        console.log(users);
        context.commit('setContacts', users);
        resolve('Success')
     })
     .catch(error => {
        reject(error)
     })

})

А потом

this.$store.dispatch('setContacts')
   .then(() => {
       console.log('dispatch called')
       console.log('getter ', this.$store.getters.contacts)
   });

Дайте мне знать, что происходит. Это работало на небольшую демонстрацию, которую я попробовал.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...