I've been encountering some major issues with vuex lately. For some reason, getters, actions, and mutations are not being recognized. In the code snippet below, although fetchFacilities is working fine, addFacility is throwing an error: [vuex] unknown action type: addFacility (from store.ts)
//...
actions: {
addFaciltiy: async function (context, fac: CFacility) {
await axios.post('/db/facilities', fac)
},
fetchFacilities: async function (context, actions) {
axios.get('/db/facilities').then((response) => response.data.forEach((element: CFacility) => {
context.commit('addFacility', element);
}));
}
//...
(from the vue component)
import Vue from "vue";
import { CFacility } from "./model";
import { mapGetters, mapActions } from "vuex";
export default Vue.extend({
//...
methods: mapActions(["fetchFacilities", "addFacility"]),
//...
created() {
this.fetchFacilities("a");
this.addFacility(
new CFacility(//..)
);
}}
I am using the autogenerated store.ts. I have read through countless posts of people messing up modules and their namespaces, which I don't use. I tried arrow notation for the actions, rewrote the actions multiple times and accessed them via dispatch and via mapActions.