Within my brands.js store, there is an action that invokes the API:
getBrandMerchants({ commit }, id) {
commit('setLoading', true);
BrandService.getBrandMerchants(id)
.then((response) => {
commit('setBrand', formatter.deserialize(response.data.result.brand));
commit('setMerchants', formatter.deserialize(response.data.result.merchants));
commit('setLoading', false);
console.log('First');
})
.catch((error) => {
if (error.response.status === 401) {
dispatch('alert/error', error.response, { root: true });
} else {
Toast.open({
type: 'is-danger', message: error.response.data.meta.message,
});
}
});
},
The components in use contain the following code snippets:
...mapState('brands', ['merchants']),
...mapActions('brands', ['getBrandMerchants']),
Upon trying to execute this method within a component:
addMerchantsToBrandGroup(index) {
const { id } = this.rows[index].brand;
if (id === null) { return; }
this.getBrandMerchants(id)
.then(() => {
console.log('Second');
this.rows[index].merchants = this.merchants
});
},
The output in the console appears as:
Second
First
I am seeking a way to ensure the console displays:
First
Second