Vue Navigator firing even the Vuex Dispatch response is pending.
JacobFJ opened this issue · 0 comments
JacobFJ commented
Hello,
I just use this very efficient way of navigation library
but I encounter a problem between vuex and this navigation library
Expected to happen:
Wait for API response before firing this.$navigator.navigate('thispath')
Current:
Once @tap="handleLogin" vuex dispatch will run but vue navigator will fire even the response is pending in dev console
Reproduce:
Login.vue
handleLogin() {
if (this.user.mobile && this.user.password) {
this.$store.dispatch("connect/login", this.user).then(
() => {
// running even the response is pending.
this.$navigator.navigate("/auth/");
//Testing alert
alert();
},
(error) => {
alert("Not found");
}
);
AuthService.js
login(user) {
return axios
.post(API_URL + 'login', {
mobile: user.mobile,
password: user.password
})
.then(response => {
if (response.data) {
// mock
}
return response.data;
});
}
Vuex Module
login({ commit }, user) {
return AuthService.login(user).then(
user => {
commit('loginSuccess', user);
return Promise.resolve(user);
},
error => {
commit('loginFailure');
return Promise.reject(error);
}
);
Visual Ref:
Thanks