Tengo el error:
Error in v-on handler (Promise/async): "TypeError: Cannot read properties of undefined (reading 'dispatch')" cuando intento hacer el login comunicandome a una accion en vuex por medio de dispatch.
Así tengo el archivo principal de Vue (main.js):
main.js
import Vue from 'vue';
import DashboardPlugin from './plugins/dashboard-plugin';
import App from './App.vue';
// router setup
import router from './routes/router';
import store from './store';
// plugin setup
Vue.use(DashboardPlugin);
/* eslint-disable no-new */
new Vue({
store,
router,
el: '#app',
render: h => h(App),
});
El archivo que llama store es el siguiente:
index.js
import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
axios.defaults.withCredentials = true;
Vue.use(Vuex);
const store = new Vuex.Store({
state: {},
mutations: {},
actions: {
async login(raw){
await axios.get('http://localhost:8000/sanctum/csrf-cookie')
await axios.post('http://localhost:8000/login',raw)
},
},
modules: {}
})
export default store
Y el método de vue donde llamo a la acción login es este:
login.vue
methods: {
onSubmit() {
this.$store.dispatch('login');
}
}
Si desde el main.js yo llamo al dispatch `store.dispatch('login') si me esta funcionando pero desde el login me devuelve el error de la pregunta.